  /**
Theme Name: Astra Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/

@import url("https://fonts.googleapis.com/css2?family=Varela+Round&display=swap");

@font-face {
  font-family: "Arial Rounded MT";
  src: url("ArialRoundedMTBold.woff2") format("woff2"),
    url("ArialRoundedMTBold.woff") format("woff"),
    url("ArialRoundedMTBold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

p {
  font-family: "Varela Round";
}

body {
  /* background-color: #253442 !important;*/
}
.mb-20 {
  margin-bottom: 2rem;
}

.uppercase {
  text-transform: uppercase;
}
.center-block {
  margin: 0 auto;
  display: block;
}

.container {
  max-width: 680px;
  width: 100%;
  margin: auto;
}

/** Header */

/** MAIN **/

/** FOOTER **/

.site-footer-above-section-1 {
  background-color: var(--ast-global-color-1);
  color: white;
  padding: 20px;
}
.site-footer-above-section-2 {
  background-color: var(--ast-global-color-0);
  color: white;
  padding: 0;
  margin: 0;
  .footer-widget-area {
    margin: 0 !important;
  }
  h2 {
    padding: 20px;
    padding-bottom: 0;
  }
  #block-11 {
    padding: 0 20px;
  }

  iframe {
    width: 100%;
    height: 280px;
  }
}
ul.social li a {
  font-weight: normal !important;
}

.site-footer-above-section-3 {
  aside .widget {
    background-color: var(--ast-global-color-1);
    margin: 0;
    padding: 20px;
    color: white;
    ul li {
      text-align: center;
      display: block;
      font-size: 1.3rem;
      text-transform: uppercase;
      a {
        color: white;
        font-weight: 900;
      }
    }
  }
  h2 {
    color: white;
  }
  #block-15 {
    margin-bottom: 10px;
  }
}

footer .widget {
  font-size: 1.13rem;
  h2 {
    color: white;
    text-align: center;
    font-weight: 900;
    text-transform: uppercase;
    line-height: 2.3rem;
    font-size: 2.3rem;
  }
}

.ast-builder-footer-grid-columns {
  grid-column-gap: 15px !important;
}

/** PAGES */

.menu-menu-paginas-container {
  margin-bottom: 200px;
  ul {
    margin: 80px auto;
    max-width: 400px;
    width: 100%;
    list-style: none;
    li {
      margin-bottom: 20px;

      text-align: center;
      font-weight: 900;
      font-size: 1.3rem;
      background-color: var(--ast-global-color-1);
      padding: 10px;
      border-radius: 50px;
      text-transform: uppercase;
      &:nth-child(even) {
        background-color: var(--ast-global-color-0);
      }
      a {
        color: white;
        text-decoration: none;
        font-size: 2rem;
      }
    }
  }
}

.wp-block-gallery.has-nested-images figure.wp-block-image img {
  max-width: 100px !important;
}

@media screen and (min-width: 1024px) {
}
.dd-button {
  display: none;
}
.dd-input {
  display: none;
}

@media screen and (max-width: 767px) {
  #masthead .site-logo-img .astra-logo-svg,
  .ast-header-break-point
    #ast-fixed-header
    .site-logo-img
    .custom-logo-link
    img {
    max-width: 60px !important;
    width: 60px !important;
    height: 60px !important;
  }
  [data-section="section-header-mobile-trigger"]
    .ast-button-wrap
    .mobile-menu-toggle-icon
    .ast-mobile-svg {
    width: 40px;
    height: 40px;
  }
  .ast-header-break-point .ast-mobile-header-wrap .ast-flex.stack-on-mobile {
    flex-direction: column;
  }
  .titulo-lateral {
    text-align: center;
    font-size: 1.5rem;
    margin: 20px auto;
  }

  /* Dropdown */

  .dropdown {
    position: relative;
    display: block;
  }

  .dd-button {
    display: inline-block;
    border: 1px solid gray;
    border-radius: 4px;
    padding: 10px 30px 10px 20px;
    background-color: #ffffff;
    cursor: pointer;
    white-space: nowrap;
    width: 100%;
  }

  .dd-button:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid black;
  }

  .dd-button:hover {
    background-color: #eeeeee;
  }

  .dd-menu {
    position: absolute;
    top: 100%;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 0;
    margin: 2px 0 0 0;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);
    background-color: #ffffff;
    list-style-type: none;
  }

  .dd-input + .dd-menu {
    display: none;
  }

  .dd-input:checked + .dd-menu {
    display: block;
    width: 100%;
    margin: 0;
  }

  .dd-menu li {
    padding: 10px 20px;
    cursor: pointer;
    white-space: nowrap;
  }

  .dd-menu li:hover {
    background-color: #f6f6f6;
  }

  .dd-menu li a {
    display: block;
    margin: -10px -20px;
    padding: 10px 20px;
  }

  .dd-menu li.divider {
    padding: 0;
    border-bottom: 1px solid #cccccc;
  }
}

/** OCULTAR BOTÓ SCROLL TOP (ASTRA) **/
#ast-scroll-top{
display:none !important;
}

#primary {
  font-family: "Varela Round";
  background-color: #fff;
}
.text-right {
  text-align: right;
}
.title {
  color: #ffa82b;
  font-size: 1.2rem;
  font-weight: 900;
  line-height: normal;
  padding: 40px 0;
  span.millennials {
    font-size: 3rem;
    color: #fff;
    display: block;

    &.blue {
      color: #253442;
    }
    span {
    }
  }
}

a.logo {
  display: block;
  border-bottom: 1px solid rgba(118, 188, 171, 0.45);
  padding: 20px 0;
}

.logo img {
  max-width: 390px;
  display: block;
  padding: 20px 0;
  margin: auto;
  animation: fadeLogo 1.2s ease;
}

.top-home {
  background-color: #253442 !important;
  font-family: "Varela Round";
  text-align: center;
  color: white;
  font-size: 2rem;
  .container {
    max-width: 768px;
  }
  h1,
  h2,
  p {
    color: white;
    margin: 0;
    strong {
      color: #ffa82b;
    }
  }
  h1 {
    font-family: "Arial Rounded MT";
    font-size: 2.7rem;
    padding: 50px 0;
  }
  h2 {
    font-family: "Arial Rounded MT";

    font-size: 2.7rem;
    color: #459989;
  }
  p {
    padding: 20px 0;
	line-height: normal;
  }
}

.destacats {
  background-color: #253442 !important;
  font-family: "Varela Round";
  padding-top: 10px;
  padding-bottom: 80px;

  color: #fff;
  .destacat {
  cursor: pointer;
  background-color: #459989 !important;
  margin-bottom: 40px;
  border-radius: 40px;
  color: #fff;
  padding: 40px;
  max-width: 600px;
  margin: 24px auto 16px;
}
    .separador {
      border-radius: 20px;
      width: 90px;
      display: block;
      padding: 18px 0;
      margin-bottom: 10px;
      background-color: #253442 !important;
    }
    h3 {
      color: #253442;
      text-align: left;
      font-weight: normal;
      font-size: 3.2rem;
      text-transform: uppercase;
    }
    p {
      font-size: 2.3rem;
      font-weight: 500;
      line-height: normal;
    }
    &.pink {
      background-color: #e36578 !important;
      + .text-inferior {
        color: #e36578 !important;
      }
    }
    &.green {
      background-color: #459989 !important;
      + .text-inferior {
        color: #459989 !important;
      }
    }
    &.yellow {
      background-color: #ffa82b !important;
      + .text-inferior {
        color: #ffa82b !important;
      }
    }
  }
  .text-inferior {
    text-align: center;
    color: white;
    font-size: 2rem;
    max-width: 680px;
    margin: 0 auto;
    line-height: normal;
  }
}
.logo-redes {
  display: block;
  margin: 20px auto;
  text-align: center;
}

.page-id-29 .destacats .destacat {
  background-color: #e36578 !important;
}

.estrategies {
  padding: 80px 0;
  .container {
    max-width: 960px;
  }
  h2 {
    font-family: "Arial Rounded MT";
    font-size: 2.7rem;
  }
  .grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 60px;
  }
  .post {
    text-align: center;
    font-size: 1.3rem;
    h4 {
      font-size: 1.13rem;
      font-weight: 500;
    }
  }
}

.support {
  font-family: "Arial Rounded MT";

  background-color: #253442 !important;
  padding: 40px 0;
  font-size: 2.3rem;
  color: #ffa82b;
}

.equip {
  padding-bottom: 80px;
  background-color: white;
  .grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
  .person {
    font-family: "Arial Rounded MT";

    text-align: center;
    color: #459989;
    font-weight: bold;
    p {
      font-size: 1.7rem;
      font-family: "Arial Rounded MT";
    }
    h4 {
      font-family: "Arial Rounded MT";

      font-size: 3rem;
    }
  }
}
.site-above-footer-wrap {
  background-color: #459989 !important;
  background-image: none !important;
  min-height: auto !important;
}

.ast-builder-menu-mobile
  .main-navigation
  .main-header-menu
  .menu-item
  > .menu-link {
  color: white;
  font-size: 20px;
}

[data-section="section-header-mobile-trigger"]
  .ast-button-wrap
  .mobile-menu-toggle-icon
  .ast-mobile-svg {
  width: 40px;
  height: 40px;
}
.millennials {
  .container {
    max-width: 960px;
  }
  .title {
    font-family: "Arial Rounded MT";
    font-size: 1.4rem;
    margin: 0 auto;
    max-width: 400px;
  }
}

.millennials-bottom{
background:#253442 !important;
padding:72px 0 78px;
border-top:1px solid rgba(255,255,255,0.06);
}

.millennials-bottom-inner{
max-width:1180px;
margin:0 auto;
padding:0 40px;
display:grid;
grid-template-columns:repeat(3, minmax(0, 1fr));
gap:44px;
align-items:start;
}

.business-unit{
text-align:center;
color:#ffffff;
}

.business-unit-logo{
display:block;
margin:0 auto 18px;
max-width:170px;
width:100%;
height:auto;
}

.business-unit-subtitle{
margin:0 0 10px 0;
font-size:1.05rem;
line-height:1.35;
color:rgba(255,255,255,0.9);
}

.business-unit-mail{
display:inline-block;
font-size:1rem;
line-height:1.3;
color:#f3b03f;
text-decoration:none;
transition:opacity .25s ease;
}

.business-unit-mail:hover{
opacity:.8;
}

@media (max-width: 768px){
  .millennials-bottom{
    padding:46px 0 50px;
  }

  .millennials-bottom-inner{
    grid-template-columns:1fr;
    gap:34px;
    padding:0 20px;
  }

  .business-unit-logo{
    max-width:135px;
    margin:0 auto 14px;
  }

  .business-unit-subtitle{
    font-size:1rem;
    margin-bottom:8px;
  }

  .business-unit-mail{
    font-size:.96rem;
  }
}
.motiva {
  color: #ffa82b;
  font-size: 3rem;
  line-height: normal;
  margin: auto;
  margin-top: 40px;
  max-width: 400px;
  width: 100%;
  text-align: center;
  img {
    margin-top: 20px;
  }
}

/* control línia desktop / mòbil */

.motiva {
  white-space: nowrap;
}

@media (max-width: 768px) {

  .motiva {
    white-space: normal;
    font-size: 2rem;
  }

  .top-home h1 {
  font-size: 2.1rem !important;
  line-height: 1.2 !important;
}

.top-home h5 {
  font-size: 1.7rem !important;
  line-height: 1.2 !important;
}

.top-home p {
  font-size: 1.3rem !important;
  line-height: 1.35 !important;
}

}

.galeria {
  padding: 80px 0;
  background-color: #253442 !important;
  h4 {
    font-family: "Arial Rounded MT";
    text-align: center;
    color: white;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 3rem;
  }
  .container {
    max-width: 960px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px; /* Puedes ajustar el espacio entre imágenes */
  }
}

.video,
.clients {
  padding: 80px 0;
  background-color: #253442 !important;

  .player {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
    }
  }
  .container {
    max-width: 960px;
  }
  .grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 50px 100px;
  }
  .post {
    text-align: center;
    font-size: 1.3rem;
    position: relative;
    h4 {
      font-size: 1.7rem;
      font-weight: bold;
      color: white;
    }
    img.img-estrategies {
      position: absolute;
      width: 80px;
      left: -20px;
      top: 0;
      border-radius: 100%;
      border: 0 !important;
    }
  }
  h4 {
    font-family: "Arial Rounded MT";
    text-align: center;
    color: white;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 3rem;
  }
}

.clients .post img {
  border: 2px solid #fff;
}
.clients .post h4 {
  text-transform: none;
  font-size: 1.3rem;
  margin-bottom: 8px;
  padding-left: 20px;
}

#ast-scroll-top {
  color: white !important;
}

.page-id-13 .clients .post img {
  border: 0px !important;
  border-radius: 40px;
}
.title {
  max-width: 300px;
  margin: 40px auto 0;
}

.carousel {
  perspective: 200px;
  height: 800px;
}

.carousel .carousel-item {
  transform-style: preserve-3d;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 400px !important; /* Más ancho */
  height: 710px !important; /* Más alto (9:16) */
}

.youtube-vertical-wrapper {
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 12px;
}

.youtube-vertical-wrapper iframe {
  width: 100%;
  height: 100%;
  border: none;
  backface-visibility: hidden;
  transform: translateZ(0);
}

/* Evita que los secundarios se vean demasiado pequeños */
.carousel .carousel-item img,
.carousel .carousel-item iframe {
  max-height: 100%;
  object-fit: cover;
}

.carousel .carousel-item:not(.active) iframe {
  pointer-events: none;
}

@media screen and (min-width: 768px) {
  .ast-desktop-popup-content {
    height: 100vh;
  }
  .ast-builder-menu-mobile
    .main-navigation
    .main-header-menu
    .menu-item
    > .menu-link {
    font-size: 2.3rem;
    font-family: "Arial Rounded MT";
  }
  .ast-builder-menu-mobile.ast-builder-menu.ast-builder-menu-mobile-focus-item.ast-builder-layout-element.site-header-focus-item {
    display: flex;
    align-items: center;
    height: 100%;
  }
}

.top-social {
  background-color: #459989;
  padding: 5px;
  .container {
    max-width: 775px;
    display: flex;
    justify-content: end;
  }
  img {
    width: 18px;
    margin-left: 15px;
  }
}

.page-id-29 .top-social {
  background-color: #e36578;
}
.page-id-103 .top-social {
  background-color: #ffa82b;
}

@media (min-width: 921px) {
  header {
    background-color: #253442 !important;
  }
  .ast-theme-transparent-header #masthead {
    position: relative !important;
    padding-top: 5px;
  }
}

.ast-mobile-popup-drawer.active .ast-mobile-popup-inner {
  background-color: rgba(37, 52, 66, 0.95);
}

nav#ast-desktop-site-navigation {
  background: none !important;
  box-shadow: none;
}

@media (max-width: 921px) {
  .ast-builder-menu-mobile
    .main-navigation
    .menu-item.current-menu-item
    > .menu-link,
  .ast-builder-menu-mobile
    .main-navigation
    .inline-on-mobile
    .menu-item.current-menu-item
    > .ast-menu-toggle,
  .ast-builder-menu-mobile
    .main-navigation
    .menu-item.current-menu-ancestor
    > .menu-link,
  .ast-builder-menu-mobile
    .main-navigation
    .menu-item.current-menu-ancestor
    > .ast-menu-toggle,
  .ast-builder-menu-mobile .main-navigation .main-header-menu,
  .ast-builder-menu-mobile .main-navigation .main-header-menu .menu-link,
  .ast-builder-menu-mobile .main-navigation .main-header-menu .sub-menu {
    background-color: rgba(37, 52, 66, 0.95);
  }
}
.ahfb-svg-iconset svg {
  width: 40px;
  height: 40px;
}

.video-featured {
  position: relative;
  margin-bottom: 2rem;
}
.video-featured img {
  width: 100%;
  border-radius: 1rem;
}
.video-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}
.video-item img {
  width: 100%;
  border-radius: 0.75rem;
  transition: transform 0.3s ease;
}
.video-item:hover img {
  transform: scale(1.03);
}
.play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: rgba(0, 0, 0, 0.6);
  color: white;
  font-size: 1.3rem;
  padding: 0.5rem 1rem;
  border-radius: 50%;
  pointer-events: none;
}
.video-item a,
.video-featured a {
  position: relative;
  display: block;
}
.fancybox__container {
  z-index: 99999; /* asegura que se muestre sobre todo */
}

.fancybox-slide--video .fancybox-content,
.fancybox-slide--map .fancybox-content,
.fancybox-slide--iframe .fancybox-content {
  height: 100vh !important;
}

@media (max-width: 767px) {
  span.site-logo-img {
    display: none;
  }
  .ast-theme-transparent-header #masthead {
    padding-top: 20px;
  }
  .logo img {
    width: 200px;
  }
  .top-home {
    padding: 20px;
    h1 {
      font-size: 2.3rem;
      padding: 20px 0;
    }
    h2 {
      font-size: 2.13rem;
    }
    p {
      font-size: 1.5rem;
    }
  }
  .motiva {
    font-size: 2.13rem;
    margin-top: 20px;
  }
  .millennials,
  .support {
    padding: 20px;
    font-size: 1.5rem;
  }
  .millennials .title {
    padding: 0 20px;
    font-size: 2rem;
  }
  .millennials .title .millennials {
    padding: 0;
  }
  .destacats {
    padding: 20px;
    & .destacat {
      padding: 20px;
      border-radius: 20px;
      h3 {
        font-size: 2rem;
      }
      p {
        font-size: 1.6rem;
      }
      .separador {
        width: 60px;
        padding: 12px 0;
      }
    }
    .text-inferior {
      font-size: 1.5rem;
      line-height: 2.1rem;
    }
  }

  .estrategies {
  padding: 20px;
  .grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
  }
  h2 {
    font-size: 2rem;
  }
  .post img {
    max-width: 100px;
    width: 100%;
    height: auto;
    margin: 0 auto;
    display: block;
  }
  .post h4 {
    font-size: 1.1rem;
    line-height: 1.25;
    margin-top: 10px;
  }
}
  .equip {
    padding: 20px;
    margin-bottom: 0;
    & .person {
      h4 {
        font-size: 2rem;
      }
      p {
        font-size: 1.5rem;
      }
    }
  }
  .millennials-bottom {
    flex-direction: column;
    gap: 20px;
    padding: 40px 20px 0 20px;
    div {
      margin-bottom: 40px;
    }
    img {
      height: 100px;
    }
  }
  .galeria,
  .clients,
  .video {
    padding: 20px;
    h4 {
      font-size: 2.5rem;
    }
    .grid {
      gap: 20px;
      grid-template-columns: repeat(1, 1fr);
      padding: 0 30px;
    }
  }

  .video,
  .clients {
    & .post {
      img.img-estrategies {
        width: 70px;
      }
    }
  }

  .galeria .container {
    grid-template-columns: repeat(2, 1fr);
  }
  .logo-redes svg {
    max-width: 50px;
  }
}
@keyframes fadeLogo {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.top-home .container h1 {
  animation: fadeTitle 1s ease both;
  animation-delay: 0.25s;
}

.top-home .container p {
  animation: fadeSubtitle 1s ease both;
  animation-delay: 0.5s;
}

.carousel {
  animation: fadeCarousel 1.2s ease both;
  animation-delay: 0.8s;
}

@keyframes fadeLogo {
  from {
    opacity: 0;
    transform: translateY(-18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeTitle {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeSubtitle {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeCarousel {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.top-home h2 {
  margin-top: 70px;
  margin-bottom: 8px;
  line-height: 1.05;
}

.top-home h2 + p {
  max-width: 760px;
  margin: 0 auto 42px auto;
  line-height: 1.35;
}

.top-home p {
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}

.motiva {
  margin-top: 70px;
}
.top-home p {
  font-size: 1.95rem;
  line-height: 1.35;
}
.motiva {
  font-size: 3rem;
}

.motiva img {
  display: block;
  margin: 20px auto 0 auto;
}

@media (max-width: 768px) {
  .motiva {
    font-size: 2rem;
  }
}
@media (max-width: 768px) {
.top-home p {
  max-width: 320px;
  margin-left: auto;
  margin-right: auto;
  font-size: 1.45rem;
  line-height: 1.45;
  margin-bottom: 4px;
}
@media (max-width: 768px) {

  .top-home h2 + p {
    margin-top: 0 !important;
  }

}
}
@media (max-width: 768px) {

  .top-home h2 {
    font-size: 2rem;
    margin-top: 10px;
    margin-bottom: 4px;
  }

}
@media (max-width: 768px) {

/* Titular principal */
h1.elementor-heading-title,
.elementor-widget-heading h1.elementor-heading-title {
font-size: 30px !important;
line-height: 1.25 !important;
}

/* Subtítol */
h5.elementor-heading-title,
.elementor-widget-heading h5.elementor-heading-title {
font-size: 17px !important;
line-height: 1.35 !important;
}

}
@media (max-width: 768px){

.top-home .container h1{
font-size: 25px !important;
line-height: 1.2 !important;
}

.top-home .container h5{
font-size: 17px !important;
line-height: 1.3 !important;
}

}
@media (max-width: 768px){

.top-home .container h1{
font-size:25px !important;
line-height:1.2 !important;
}

.top-home .container h5{
font-size:17px !important;
line-height:1.35 !important;
max-width:280px;
margin-left:auto;
margin-right:auto;
text-align:center;
color:#f3b03f !important;
}

.top-home .carousel{
margin-top:20px !important;
}

.top-home .logo{
margin-bottom:20px !important;
}

.top-home hr{
opacity:0.35;
}

}
.clients-premium{
  padding:110px 0 40px;
  position:relative;
  background:linear-gradient(
    to bottom,
    rgba(34,53,69,0) 0%,
    rgba(34,53,69,0.35) 12%,
    #223545 28%
  );
}

.clients-premium .container{
max-width:1320px !important;
width:100%;
margin:0 auto;
}

.clients-premium-header{
max-width:850px;
margin:0 auto 70px;
text-align:center;
position:relative;
}

.clients-premium-header h2{
margin:0 0 8px;
font-size:40px;
line-height:1.08;
color:#ffffff;
letter-spacing:0.3px;
}

.clients-premium-header p{
margin:0;
font-size:20px;
line-height:1.45;
color:#f3b03f;
opacity:0.9;
letter-spacing:0.4px;
}

.clients-premium-header::after{
content:"";
display:block;
width:64px;
height:14px;
margin:24px auto 0 auto;
background:#ffffff;
border-radius:999px;
opacity:0.9;
}

.clients-premium-grid{
display:grid;
grid-template-columns:1fr;
gap:26px;
max-width:1120px;
padding:0 40px;
margin:28px auto 0;
}

.client-premium-card{
position:relative;
display:block;
overflow:hidden;
border-radius:36px;
border:none;
aspect-ratio:16 / 8.2;
background:#21384b;
text-decoration:none;
box-shadow:none;
transition:transform .25s ease;
}

.client-premium-card:hover{
transform:translateY(-6px);
box-shadow:none;
}

.client-premium-bg{
width:100%;
height:100%;
object-fit:cover;
display:block;
transform:scale(1);
transition:transform .5s ease;

/* dissolució cap al fons de la web */
mask-image: linear-gradient(
to bottom,
rgba(0,0,0,1) 0%,
rgba(0,0,0,1) 50%,
rgba(0,0,0,0) 100%
);

-webkit-mask-image: linear-gradient(
to bottom,
rgba(0,0,0,1) 0%,
rgba(0,0,0,1) 50%,
rgba(0,0,0,0) 100%
);
}
.client-premium-card:hover .client-premium-bg{
transform:scale(1.03);
}

.client-premium-overlay{
position:absolute;
inset:0;
background:linear-gradient(
to bottom,
rgba(34,53,69,0.30) 0%,
rgba(34,53,69,0.14) 16%,
rgba(34,53,69,0.04) 36%,
rgba(34,53,69,0.00) 58%,
rgba(34,53,69,0.06) 78%,
rgba(34,53,69,0.16) 90%,
rgba(34,53,69,0.28) 100%
);
border-radius:28px;
z-index:1;
pointer-events:none;
}

.client-premium-logo{
position:absolute;
top:26px;
left:26px;
max-width:220px;
max-height:90px;
width:auto;
height:auto;
z-index:2;
object-fit:contain;
filter:drop-shadow(0 3px 12px rgba(0,0,0,0.28));
opacity:0.98;
}

@media (max-width:768px){

.clients-premium{
padding:50px 0 20px;
}

.clients-premium .container{
max-width:100% !important;
width:100% !important;
padding-left:8px !important;
padding-right:8px !important;
}

.clients-premium-header{
margin:0 auto 28px;
}

.clients-premium-header h2{
font-size:30px;
line-height:1.15;
margin:0 0 14px;
}

.clients-premium-header p{
font-size:17px;
line-height:1.45;
}

.clients-premium-grid{
grid-template-columns:1fr !important;
gap:11px !important;
max-width:none !important;
padding:0;
margin:0 auto;
}

.client-premium-card{
border-radius:28px;
border:none;
margin-bottom:15px;
}

.client-premium-logo{
position:absolute;
top:30px;
left:30px;
max-width:170px;
max-height:68px;
width:auto;
height:auto;
z-index:2;
object-fit:contain;
filter:drop-shadow(0 3px 12px rgba(0,0,0,0.28));
opacity:0.98;
}

}
@media (max-width: 768px){

.equip .grid{
grid-template-columns: repeat(3, 1fr);
gap: 16px;
}

.equip .person h4{
font-size:1.6rem;
}

.equip .person p{
font-size:1.1rem;
line-height:1.3;
}

}
@media (max-width:768px){

.equip .grid{
grid-template-columns:repeat(3,1fr);
gap:16px;
align-items:start;
}

.equip .person{
display:flex;
flex-direction:column;
align-items:center;
justify-content:flex-start;
text-align:center;
}

.equip .person h4{
font-size:1.6rem;
margin-bottom:6px;
}

.equip .person p{
font-size:1.1rem;
line-height:1.3;
margin:0;
}

}
/* Títol secció equip */
.equip h2{
font-size:2.2rem;
line-height:1.1;
margin-bottom:10px;
}

/* paraula "equip" */
.equip h2 span{
font-size:1.2rem;
}

/* mòbil */
@media (max-width:768px){

.equip h2{
font-size:1.8rem;
}

.equip h2 span{
font-size:1rem;
}

}
/* Títol MILLENNIALS equip */
.equip .elementor-heading-title{
font-size:2.2rem !important;
line-height:1.1 !important;
}

/* mòbil */
@media (max-width:768px){
.equip .elementor-heading-title{
font-size:1.7rem !important;
}
}
.equip img{
max-width:420px;
width:100%;
height:auto;
margin:0 auto;
display:block;
}
@media (max-width:768px){

.equip img{
max-width:260px;
}

}
./* desktop no tocar */
.millennials .title .millennials img{
max-width:500px;
width:100%;
height:auto;
display:block;
margin:0 auto;
}

@media (max-width:768px){

.millennials .title .millennials img{
max-width:220px;
}

}
.equip .person h4{
position:relative;
padding-bottom:8px;
margin-bottom:8px;
}

.equip .person h4::after{
content:"";
width:26px;
height:3px;
background:#459989;
display:block;
margin:6px auto 0 auto;
border-radius:2px;
}
/* títol MILLENNIALS equip */
.millennials .title .millennials img{
max-width:280px !important;
width:100%;
height:auto;
display:block;
margin:0 auto;
}

/* mòbil */
@media (max-width:768px){

.millennials .title .millennials img{
max-width:180px !important;
}

}
.home-hero {
  position: relative;
  overflow: hidden;
  min-height: 0;
}

.home-hero-media {
  position: relative;
  width: 100%;
  aspect-ratio: 2 / 1;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  z-index: 1;
}

.home-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(34,53,69,0.10) 0%,
    rgba(34,53,69,0.30) 40%,
    rgba(34,53,69,0.70) 70%,
    #223545 100%
  );
  z-index: 2;
}

.home-hero-content {
  position: absolute;
  left: 50%;
  bottom: 12%;
  transform: translateX(-50%);
  z-index: 3;
  text-align: center;
  width: min(92%, 900px);
}

.home-hero-content h1 {
  color: #ffffff;
  font-size: clamp(1.8rem, 3vw, 3rem);
  line-height: 1.05;
  margin: 0 !important;
  font-weight: 600;
  transform: translateY(40px);
}

.home-hero-content h5,
.home-hero-content p {
  color: #f3b03f;
  font-size: clamp(1rem, 1.6vw, 1.45rem);
  line-height: 1.15;
  margin: 0 !important;
}

a.logo{
display:none;
}

.home-hero{
  position:relative;
  overflow:hidden;
  min-height:78vh;
  background:#223545;
}

.home-hero-media{
  position:absolute;
  inset:0;
  height:100%;
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  z-index:1;

/* fusió inferior amb el fons */
mask-image: linear-gradient(
to bottom,
rgba(0,0,0,1) 0%,
rgba(0,0,0,1) 45%,
rgba(0,0,0,0.45) 70%,
rgba(0,0,0,0.1) 85%,
rgba(0,0,0,0) 100%
);

-webkit-mask-image: linear-gradient(
to bottom,
rgba(0,0,0,1) 0%,
rgba(0,0,0,1) 45%,
rgba(0,0,0,0.45) 70%,
rgba(0,0,0,0.1) 85%,
rgba(0,0,0,0) 100%
);
}
.home-hero-overlay{
position:absolute;
inset:0;
background: linear-gradient(
to bottom,
rgba(34,53,69,0.88) 0%,
rgba(34,53,69,0.70) 18%,
rgba(34,53,69,0.42) 38%,
rgba(34,53,69,0.32) 55%,
rgba(34,53,69,0.55) 72%,
rgba(34,53,69,0.78) 88%,
rgba(34,53,69,0.92) 96%,
rgba(34,53,69,1) 100%
);
z-index:2;
}

.hero-logo{
  position:absolute;
  top:96px;
  left:50%;
  transform:translateX(-50%);
  z-index:4;
  display:block;
  width:320px;
}

.hero-logo img{
  width:100%;
  height:auto;
  display:block;
  margin:0 auto;
}

.home-hero-content{
  position:absolute;
  left:8%;
  bottom:12%;
  transform:none;
  z-index:3;
  width:620px;
  text-align:left;
}

.home-hero-content h1{
  color:#ffffff;
  font-size:clamp(2.2rem, 3.2vw, 3.6rem);
  line-height:1.02;
  margin:0 0 16px 0 !important;
  font-weight:600;
  max-width:760px;
}

.home-hero-content h5,
.home-hero-content p{
  color:#f3b03f;
  font-size:clamp(1rem, 1.2vw, 1.2rem);
  line-height:1.35;
  margin:0 !important;
  max-width:620px;
  opacity:0.92;
}

.home-hero-content > *{
  margin-left:0 !important;
  margin-right:0 !important;
}

@media (max-width: 768px){
  .home-hero{
    min-height:82vh;
  }

  .hero-logo{
    top:54px;
    width:220px;
  }

  .home-hero-content{
    bottom:9%;
    width:90%;
    text-align:center;
  }

  .home-hero-content h1{
    font-size:2.35rem;
    line-height:1.08;
    max-width:none;
    margin:0 0 12px 0 !important;
  }

  .home-hero-content h5,
  .home-hero-content p{
    font-size:1.08rem;
    max-width:none;
  }

  .home-hero-content > *{
    margin-left:auto !important;
    margin-right:auto !important;
  }
}

@media (max-width: 767px) {
  .home-hero-media {
    aspect-ratio: 4 / 5;
    background-position: center center;
  }

  .home-hero-content {
    bottom: 8%;
    width: 90%;
  }

  .home-hero-content h1 {
    font-size: 2.2rem;
    line-height: 1.12;
  }

  .home-hero-content h5,
  .home-hero-content p {
    font-size: 1.02rem;
  }
}

.home-hero-content > * {
  margin-left: auto !important;
  margin-right: auto !important;
}

.home-hero-content h1 {
  margin-bottom: 4px !important;
}

.home-hero-content h5,
.home-hero-content p {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.top-social {
  min-height: 28px;
  height: 28px;
  padding: 0 !important;
  display: flex;
  align-items: center;
}

.top-social .container {
  justify-content: center !important;
}

.top-social .container a,
.top-social .container img,
.top-social .container svg {
  display: none !important;
}
@media (min-width: 922px) {
  .site-header {
    position: absolute;
    inset: 28px 0 auto 0;
    background: transparent !important;
    z-index: 30;
    pointer-events: none;
  }

  .site-header .ast-builder-grid-row-container,
  .site-header .ast-builder-row,
  .site-header .site-primary-header-wrap,
  .site-header .main-header-bar {
    background: transparent !important;
    box-shadow: none !important;
    min-height: 0 !important;
  }

  [data-section="section-header-mobile-trigger"] {
    position: absolute;
    top: 34px;
    right: 60px;
    z-index: 40;
    pointer-events: auto;
  }

  [data-section="section-header-mobile-trigger"] .ast-button-wrap {
    pointer-events: auto;
  }

  [data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg,
  [data-section="section-header-mobile-trigger"] .menu-toggle-icon,
  [data-section="section-header-mobile-trigger"] .menu-toggle-icon * {
    fill: #ffffff !important;
    color: #ffffff !important;
  }
}
[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg,
.menu-toggle-icon,
.menu-toggle-icon * {
  opacity: 0.75;
  transition: opacity .25s ease, transform .25s ease;
}

[data-section="section-header-mobile-trigger"]:hover .ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg,
.menu-toggle-icon:hover,
.menu-toggle-icon:hover * {
  opacity: 1;
  transform: translateY(-2px);
}
.hero-logo {
  opacity: 0;
  transform: translate(-50%, 20px);
  animation: heroLogoFade 0.9s ease-out forwards;
  animation-delay: 0.4s;
}

@keyframes heroLogoFade {
  from {
    opacity: 0;
    transform: translate(-50%, 20px);
  }

  to {
    opacity: 1;
    transform: translate(-50%, 0);
  }
}
/* LOGO */
.hero-logo {
  opacity: 0;
  transform: translate(-50%, 20px);
  animation: heroLogoFade 0.9s ease-out forwards;
  animation-delay: 0.4s;
}

/* TITULAR */
.home-hero-content h1 {
  opacity: 0;
  transform: translateY(20px);
  animation: heroTextFade 0.9s ease-out forwards;
  animation-delay: 1.2s;
}

/* SUBTÍTOL */
.home-hero-content p,
.home-hero-content h5 {
  opacity: 0;
  transform: translateY(20px);
  animation: heroTextFade 0.9s ease-out forwards;
  animation-delay: 1.6s;
}

/* ANIMACIONS */

@keyframes heroLogoFade {
  from {
    opacity: 0;
    transform: translate(-50%, 20px);
  }
  to {
    opacity: 1;
    transform: translate(-50%, 0);
  }
}

@keyframes heroTextFade {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.hero-social{
display:flex;
justify-content:center;
align-items:center;
gap:24px;
margin-top:70px;
margin-bottom:40px;
opacity:0.7;
}

.hero-social img{
  width:18px;
  height:18px;
}

.hero-social a{
  transition:all .25s ease;
}

.hero-social a:hover{
  opacity:1;
  transform:translateY(-2px);
}
.hero-social{
  opacity:0.7;
  margin-bottom:28px;
}

.hero-social img{
  width:16px;
  height:16px;
}

.hero-social a{
  transition:all .25s ease;
}

.hero-social a:hover{
  opacity:1;
  transform:translateY(-2px);
}
.home-hero{
position:relative;
overflow:hidden;
min-height:78vh;
background:#223545;
}

.hero-social{
  position: relative;
  z-index: 5;
}
.values-premium{
  max-width:1180px;
  margin:0 auto;
  padding:140px 0 120px;
}

.values-premium-row{
  display:grid;
  grid-template-columns:minmax(220px, 300px) minmax(0, 1fr);
  gap:70px;
  align-items:start;
  padding:58px 0;
  position:relative;
}

.values-premium-row::before{
content:"";
position:absolute;
top:-22px;
left:50%;
transform:translateX(-50%);
width:32px;
height:6px;
border-radius:30px;
background:#ffffff;
opacity:0.85;
}
.values-premium-row:first-child::before{
display:none;
}
.values-premium-row:last-child{
  border-bottom:1px solid rgba(255,255,255,0.08);
}

.values-premium-title{
  font-family:"Arial Rounded MT";
  font-size:clamp(1.7rem, 1.8vw, 2.1rem);
  line-height:1.1;
  color:#8fc2b8;
  letter-spacing:0.2px;
}

.values-premium-text{
  font-family:"Varela Round";
  font-size:clamp(1.15rem, 1.25vw, 1.35rem);
  line-height:1.6;
  color:rgba(255,255,255,0.92);
  max-width:560px;
  text-align:left;
  margin-left:auto;
  font-weight:100;
}

.values-premium-text strong{
  color:#f3b03f;
  font-weight:normal;
}

@media (max-width: 921px){
  .values-premium{
    padding:20px 0 70px;
  }

  .values-premium-row{
    grid-template-columns:1fr;
    gap:18px;
    padding:28px 0;
  }

  .values-premium-title{
    font-size:2.2rem;
  }

  .values-premium-text{
    font-size:1.35rem;
    line-height:1.5;
    max-width:none;
  }
}
.clients-premium-grid{
perspective:1200px;
}
.client-premium-card{
opacity:0;
transform:translateY(28px) scale(0.985);
transition:
opacity .75s ease,
transform .9s cubic-bezier(.22,1,.36,1);
will-change:transform, opacity;
}

.client-premium-card.is-visible{
opacity:1;
transform:translateY(0) scale(1);
}
/* fer el primer projecte lleugerament més gran */
.client-premium-card:first-child{
aspect-ratio:16 / 8.2;
}

/* hover més elegant */
.client-premium-card:hover{
transform:translateY(-6px) scale(1.01);
}
.destacats .destacat{
transition:transform .28s ease, box-shadow .28s ease;
}

.destacats .destacat:hover{
transform:translateY(-5px);
box-shadow:0 16px 36px rgba(0,0,0,0.18);
}
.millennials-bottom{
display:flex;
justify-content:center;
align-items:flex-start;
gap:80px;
padding:80px 0;
}

.millennials-bottom > div{
text-align:center;
margin-bottom:0;
max-width:320px;
}

.millennials-bottom img{
height:120px;
margin-bottom:14px;
}

.millennials-bottom h4{
font-size:1.15rem;
margin:6px 0;
}

.millennials-bottom a{
font-size:0.95rem;
}
.footer-premium{
display:flex;
justify-content:space-between;
align-items:center;
gap:40px;
padding:28px 60px;
background:#459989;
color:#ffffff;
}

.footer-left{
display:flex;
align-items:center;
gap:14px;
min-width:180px;
}

.footer-left a{
display:flex;
align-items:center;
justify-content:center;
width:38px;
height:38px;
border:1px solid rgba(255,255,255,0.45);
border-radius:999px;
text-decoration:none;
transition:all .25s ease;
}

.footer-left a:hover{
background:rgba(255,255,255,0.12);
border-color:#ffffff;
}

.footer-left img{
width:16px;
height:16px;
display:block;
filter:brightness(0) invert(1);
opacity:.95;
}

.footer-center{
flex:1;
text-align:center;
font-size:1rem;
line-height:1.45;
color:#ffffff;
}

.footer-right{
display:flex;
flex-direction:column;
gap:2px;
min-width:180px;
align-items:flex-end;
}

.footer-right a{
color:#ffffff;
text-decoration:none;
font-size:0.95rem;
line-height:1.15;
padding:2px 0;
border:none;
text-align:right;
transition:opacity .2s ease;
}

.footer-right a:hover{
opacity:.8;
border-color:#ffffff;
}

@media (max-width: 921px){
  .footer-premium{
    flex-direction:column;
    align-items:center;
    text-align:center;
    padding:26px 22px;
    gap:22px;
  }

  .footer-left{
    min-width:auto;
  }

  .footer-center{
    font-size:.95rem;
  }

  .footer-right{
    min-width:auto;
    width:100%;
    align-items:center;
  }

  .footer-right a{
    text-align:center;
    min-width:unset;
    width:220px;
  }
}
.footer-premium{
border-top:1px solid rgba(255,255,255,0.15);
}
/* Footer verd corporatiu */

.site-above-footer-wrap{
background:#459989 !important;
}

.site-above-footer-wrap .footer-widget-area{
background:transparent !important;
}

.site-above-footer-wrap .widget{
background:transparent !important;
padding:0 !important;
margin:0 !important;
border:none !important;
box-shadow:none !important;
}
.site-footer-above-section-1,
.site-footer-above-section-2,
.site-footer-above-section-3{
background:transparent !important;
}
/* compactar menú footer */

.footer-right{
display:flex;
flex-direction:column;
align-items:flex-end;
gap:2px;
}

.footer-right a{
margin:0 !important;
padding:2px 0 !important;
line-height:1.15;
font-size:0.95rem;
border:none !important;
}

.footer-right a + a{
margin-top:2px !important;
}
.footer-right p{
margin:0 !important;
}
.footer-right{
gap:0px;
}

.footer-right a{
padding:0 !important;
line-height:1.05;
font-size:0.92rem;
}

.footer-right a + a{
margin-top:1px !important;
}
/* mostrar logo a totes les pàgines */
a.logo{
display:block;
}

/* però amagar-lo només a la home perquè allà ja tenim el hero */
.home a.logo{
display:none;
}
/* header normal a pàgines interiors */
body:not(.home) .site-header{
position:relative;
background:#223545 !important;
}

.social-cases{
  background:#253442 !important;
  padding:110px 0 90px;
}

.social-cases .container{
  max-width:1240px;
}

.social-cases-intro{
  max-width:900px;
  margin:-35px auto 56px;
  text-align:center;
}

.social-cases-intro h2{
  font-family:"Arial Rounded MT";
  font-size:3rem;
  line-height:1.05;
  color:#ffffff;
  margin:0 0 14px;
}

.social-cases-intro p{
  font-size:1.08rem;
  line-height:1.65;
  color:rgba(255,255,255,0.82);
  margin:0;
}

.social-cases-list{
  border-top:1px solid rgba(243,176,63,0.14);
}

.social-case{
  border-bottom:1px solid rgba(243,176,63,0.14);
}

.social-case-toggle{
  width:100%;
  background:none;
  border:none;
  padding:0;
  margin:0;
  color:inherit;
  cursor:pointer;
  text-align:left;
}

.social-case-grid{
  display:grid;
  grid-template-columns:1.15fr 2fr 0.9fr 0.65fr;
  gap:30px;
  align-items:start;
}

.social-case-head{
  padding:34px 44px;
}

.social-case-title{
  font-family:"Arial Rounded MT";
  font-size:1.05rem;
  line-height:1.2;
  color:#ffffff;
  opacity:.78;
  display:block;
  transition:opacity .25s ease;
  margin-left:22px;
}

.social-case-copy{
  font-size:1.04rem;
  line-height:1.6;
  color:rgba(255,255,255,0.86);
  max-width:620px;
}

.social-case-cta{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  text-align:center;
}

.social-case-channels span{
  font-size:0.95rem;
  line-height:1.2;
  color:rgba(255,255,255,0.72);
}

.social-case-cta{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-align:center;
}

.social-case-cta-text{
  font-size:.9rem;
  color:#f3b03f;
  letter-spacing:.2px;
  opacity:.9;
}

.social-case-plus{
  width:36px;
  height:36px;
  border:1px solid #f3b03f;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#f3b03f;
  font-size:1.25rem;
  line-height:1;
  transition:transform .3s ease, background .3s ease, border-color .3s ease;
}
.social-case:hover .social-case-plus{
  background:rgba(243,176,63,0.12);
  border-color:#f3b03f;
}

.social-case.is-open .social-case-plus{
  transform:rotate(45deg);
  background:rgba(229,72,72,0.10);
  border-color:#e54848;
  color:#e54848;
}

.social-case:hover .social-case-plus{
  border-color:rgba(255,255,255,0.22);
}
.social-case:hover .social-case-title{
  opacity:.95;
}

.social-case-panel{
  display:none;
  padding:0 0 40px;
  opacity:0;
  transform:translateY(10px);
  transition:opacity .25s ease, transform .3s ease;
  overflow:visible;
}

.social-case-panel{
  display:none;
  padding:60px 0 46px;
}

.social-case.is-open .social-case-panel{
  display:block;
  animation:socialReveal .55s ease;
}

@keyframes socialReveal{
  0%{
    opacity:0;
    transform:translateY(20px);
  }
  100%{
    opacity:1;
    transform:translateY(0);
  }
}

.social-case-visuals{
  position:relative;
  min-height:560px;
  overflow:hidden;
  border-radius:20px;
  background:#1f3140;
  margin-top:48px;
}

.social-case-hero{
  position:absolute;
  inset:0;
  border-radius:20px;
  overflow:hidden;
}

.social-case-hero img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  aspect-ratio:auto;
  filter:none;
}

.social-case-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:
  radial-gradient(
    circle at 78% 65%,
    rgba(34,53,69,0.00) 0%,
    rgba(34,53,69,0.18) 40%,
    rgba(34,53,69,0.42) 100%
  ),
  linear-gradient(
    to bottom,
    rgba(34,53,69,0.00) 0%,
    rgba(34,53,69,0.00) 55%,
    rgba(34,53,69,0.20) 78%,
    rgba(34,53,69,0.40) 100%
  );
  z-index:1;
}

.social-case-side{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  padding:42px 60px 42px 42px;
  display:flex;
  flex-direction:row;
  justify-content:flex-end;
  align-items:center;
}

.social-case-phones{
  display:flex;
  gap:18px;
  align-items:center;
}

.phone-card{
  position:relative;
}

.phone-card-offset{
  margin-bottom:0;
}

.phone-frame{
  position:relative;
  width:220px;
  border-radius:30px;
  background:#111820;
  padding:12px;
  box-shadow:0 18px 36px rgba(0,0,0,0.24);
}

.phone-frame video{
  width:100%;
  display:block;
  aspect-ratio:9 / 19.5;
  object-fit:cover;
  object-position:top center;
  border-radius:18px;
  background:#000;
  opacity:0;
  transition:opacity .6s ease;
}

.social-case.is-open .phone-frame video{
  opacity:1;
}

.phone-notch{
  position:absolute;
  top:9px;
  left:50%;
  transform:translateX(-50%);
  width:76px;
  height:12px;
  border-radius:999px;
  background:#0a1016;
  z-index:3;
}

.phone-frame img{
  width:100%;
  display:block;
  aspect-ratio:9 / 19.5;
  object-fit:cover;
  object-position:top center;
  border-radius:18px;
}

.social-case-extra{
  display:none;
}

@media (max-width: 900px){
  .social-case-grid{
  display:grid;
  grid-template-columns:1.1fr 2.2fr 0.9fr 0.55fr;
  gap:38px;
  align-items:start;
}

  .social-case-cta{
    justify-content:flex-start;
  }

  .social-case-visuals{
    min-height:420px;
  }

  .social-case-side{
    padding:26px;
    align-items:flex-end;
  }

  .social-case-phones{
    gap:14px;
  }

  .phone-frame{
    width:185px;
  }
}

@media (max-width: 768px){
  .social-cases{
    padding:70px 0 55px;
  }

  .social-cases .container{
    max-width:100%;
    padding-left:16px;
    padding-right:16px;
  }

  .social-cases-intro{
    margin:0 auto 40px;
  }

  .social-cases-intro h2{
    font-size:2.2rem;
  }

  .social-cases-intro p{
    font-size:1rem;
    line-height:1.55;
  }

  .social-case-head{
    padding:22px 0;
  }

  .social-case-title{
    font-size:1.7rem;
  }

  .social-case-copy{
    font-size:1rem;
    line-height:1.55;
  }

  .social-case-visuals{
    min-height:340px;
    border-radius:16px;
  }

  .social-case-hero{
    border-radius:16px;
  }

  .social-case-side{
    padding:18px;
    justify-content:flex-end;
    align-items:flex-end;
  }

  .social-case-phones{
    gap:12px;
  }

  .phone-frame{
    width:145px;
    border-radius:22px;
    padding:9px;
  }

  .phone-notch{
    width:56px;
    height:9px;
    top:7px;
  }

  .phone-frame img{
    border-radius:14px;
  }
}
/* eliminar colors agressius hover */

.social-case-toggle:hover,
.social-case-toggle:focus{
  background:transparent;
}

.social-case:hover{
  background:transparent;
}

.social-case:hover .social-case-title,
.social-case:hover .social-case-copy,
.social-case:hover .social-case-channels span{
  color:inherit;
}

.social-case-toggle:focus{
  outline:none;
}

.social-case-cta-text{
  color:#f3b03f;
}

.social-case:hover .social-case-cta-text{
  color:#f3b03f;
}
/* evitar canvi de color al hover dins dels projectes */

.social-case,
.social-case *{
  color:inherit;
}

.social-case-title{
  color:#ffffff;
}

.social-case-copy{
  color:rgba(255,255,255,0.86);
}

.social-case-channels span{
  color:rgba(255,255,255,0.72);
}

/* evitar que els links del tema canviïn a negre */

.social-case a:hover,
.social-case a:focus,
.social-case-toggle:hover .social-case-title,
.social-case-toggle:hover .social-case-copy,
.social-case-toggle:hover .social-case-channels span{
  color:inherit;
}

/* evitar background o highlight estrany */

.social-case-toggle:hover,
.social-case:hover{
  background:transparent;
}
/* fix color text dins els projectes */

.social-case-toggle,
.social-case-toggle *{
  color:#ffffff !important;
}

/* relat projecte */
.social-case-copy{
  color:rgba(255,255,255,0.86) !important;
}

/* canals */
.social-case-channels span{
  color:rgba(255,255,255,0.72) !important;
}

/* evitar que hover del tema canviï colors */
.social-case-toggle:hover,
.social-case-toggle:hover *{
  color:inherit !important;
}
/* REFINAMENT PREMIUM SOCIAL CASES */

.social-case-head{
  padding:34px 0 26px;
}

.social-case-grid{
  gap:38px;
}

.social-case-title{
  font-size:2.35rem;
  line-height:1.02;
  letter-spacing:-0.3px;
}

.social-case-copy{
  max-width:640px;
  font-size:1.08rem;
  line-height:1.62;
  color:rgba(255,255,255,0.88);
}

.social-case-channels{
  display:flex;
  flex-direction:column;
  gap:6px;
  align-items:flex-start;
}

.social-case-channels span{
  color:rgba(255,255,255,0.78);
}

.social-case-visuals{
  position:relative;
  min-height:520px;
  overflow:hidden;
  border-radius:24px;
  background:#1f3140;
  box-shadow:0 24px 60px rgba(0,0,0,0.18);
}

.social-case-hero{
  position:absolute;
  inset:0;
  overflow:hidden;
  border-radius:24px;
}

.social-case-hero img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  transform:scale(1.02);
  filter: grayscale(100%) contrast(1.08) brightness(0.72) sepia(0.10);
}

/* degradat premium principal */
.social-case-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    to bottom,
    rgba(34,53,69,0.46) 0%,
    rgba(34,53,69,0.34) 22%,
    rgba(34,53,69,0.38) 48%,
    rgba(34,53,69,0.52) 72%,
    rgba(34,53,69,0.70) 100%
  );
  z-index:1;
}

.social-case-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    to right,
    rgba(34,53,69,0.18) 0%,
    rgba(34,53,69,0.22) 35%,
    rgba(34,53,69,0.42) 68%,
    rgba(34,53,69,0.68) 100%
  );
  z-index:1;
}

/* vel lateral perquè els mòbils llegeixin millor */
.social-case-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    to right,
    rgba(34,53,69,0.00) 0%,
    rgba(34,53,69,0.04) 38%,
    rgba(34,53,69,0.18) 62%,
    rgba(34,53,69,0.42) 82%,
    rgba(34,53,69,0.58) 100%
  );
  z-index:1;
}

.social-case-side{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  padding:42px 56px 42px 42px;
  display:flex;
  justify-content:flex-end;
  align-items:center;
}

.social-case-phones{
  display:flex;
  gap:20px;
  align-items:flex-end;
}

.phone-card{
  position:relative;
}

.phone-card:first-child{
  transform:translateY(-14px);
}

.phone-card:last-child{
  transform:translateY(10px);
}

.phone-frame{
  position:relative;
  width:214px;
  border-radius:30px;
  background:#111820;
  padding:12px;
  box-shadow:
    0 18px 36px rgba(0,0,0,0.22),
    0 8px 18px rgba(0,0,0,0.18);
}

.phone-frame img{
  border-radius:18px;
}

.social-case-panel{
  padding:0 0 46px;
}

/* microefecte en obrir */
.social-case.is-open .social-case-hero img{
  transform:scale(1.04);
  transition:transform 1.4s ease;
}

@media (max-width: 1100px){
  .social-case-visuals{
    min-height:430px;
  }

  .social-case-side{
    padding:28px;
  }

  .phone-frame{
    width:182px;
  }
}

@media (max-width: 768px){
  .social-case-head{
    padding:24px 0 20px;
  }

  .social-case-title{
    font-size:1.9rem;
  }

  .social-case-copy{
    font-size:1rem;
    line-height:1.55;
  }

  .social-case-visuals{
    min-height:340px;
    border-radius:18px;
  }

  .social-case-hero,
  .social-case-hero img{
    border-radius:18px;
  }

  .social-case-side{
    padding:18px;
  }

  .phone-card:first-child,
  .phone-card:last-child{
    transform:none;
  }

  .phone-frame{
    width:145px;
    border-radius:22px;
    padding:9px;
  }

  .phone-frame img{
    border-radius:14px;
  }
}
/* CONNECTAR TEXT + HERO */

.social-case-head{
  padding:34px 0 14px;
}

.social-case-panel{
  padding:0 0 46px;
  margin-top:-6px;
}

.social-case-visuals{
  margin-top:0;
  min-height:480px;
  border-radius:24px;
  overflow:hidden;
  position:relative;
}

/* capa superior per fondre millor amb el text */
.social-case-visuals::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:120px;
  z-index:2;
  background:linear-gradient(
    to bottom,
    rgba(34,53,69,0.28) 0%,
    rgba(34,53,69,0.12) 45%,
    rgba(34,53,69,0.00) 100%
  );
  pointer-events:none;
}

.social-case-hero{
  z-index:1;
}

.social-case-side{
  z-index:3;
}

/* més integració visual */
.social-case.is-open .social-case-visuals{
  box-shadow:0 24px 60px rgba(0,0,0,0.16);
}

@media (max-width: 768px){
  .social-case-head{
    padding:24px 0 12px;
  }

  .social-case-panel{
    margin-top:0;
  }

  .social-case-visuals::before{
    height:70px;
  }
}
/* animació premium hero en obrir */

.social-case-hero img{
  transform:scale(1.02);
  transition:transform 1.2s ease;
}

.social-case-panel{
  padding:0 0 40px;
  opacity:0;
  transform:translateY(18px);
  max-height:0;
  overflow:hidden;
  transition:
    opacity .35s ease,
    transform .45s ease,
    max-height .6s ease;
}

.social-case.is-open .social-case-panel{
  opacity:1;
  transform:translateY(0);
  max-height:1400px;
}

.social-case.is-open .social-case-hero img{
  transform:scale(1.06);
}
.social-case-phones{
  opacity:0;
  transform:translateY(14px);
  transition:opacity .35s ease .08s, transform .45s ease .08s;
}

.social-case.is-open .social-case-phones{
  opacity:1;
  transform:translateY(0);
}
/* zoom cinematogràfic de la hero */

.social-case.is-open .social-case-hero img{
  animation:heroZoomStart 3.5s ease-out forwards,
           heroZoomDrift 22s linear 3.5s infinite alternate;
}

@keyframes heroZoom{
  0%{
    transform:scale(1);
  }
  100%{
    transform:scale(1.04);
  }
}
@keyframes heroZoomStart{
  0%{
    transform:scale(1);
  }
  100%{
    transform:scale(1.04);
  }
}

@keyframes heroZoomDrift{
  0%{
    transform:scale(1.04);
  }
  100%{
    transform:scale(1.06);
  }
}
/* capa subtil sobre el fons quan s'obre un projecte */

.social-case.is-open{
  position:relative;
}
/* capa subtil sobre el fons quan s'obre un projecte */

.social-case.is-open{
  position:relative;
  padding-left:0;
  padding-right:0;
  border-radius:0;
  box-shadow:none;
}

.social-case.is-open::before{
  content:"";
  position:absolute;
  inset:-60px -60px;
  background:rgba(20,30,40,0.25);
  pointer-events:none;
  z-index:-1;
}
.social-case.is-open{
  position:relative;
  padding-left:44px;
  padding-right:44px;
  border-radius:18px;
  box-shadow:0 18px 45px rgba(0,0,0,0.12);
}

.social-case.is-open::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:-80px;
  right:-80px;
  background:rgba(255,255,255,0.035);
  border-radius:18px;
  z-index:-1;
}
.social-case{
  transition:background .25s ease, box-shadow .25s ease;
  border-radius:18px;
}

.social-case:hover{
  background:rgba(255,255,255,0.02);
  box-shadow:0 8px 24px rgba(0,0,0,0.08);
}

.social-case.is-open .social-case-visuals{
  margin-top:40px !important;
}
.social-case-head .social-case-title{
  font-size:1.42rem !important;
  opacity:.85;
}
/* TREURE EFECTE TARGETA / FLOTANT DEL PROJECTE OBERT */

.social-case.is-open{
  position:relative;
  padding-left:0 !important;
  padding-right:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}

.social-case.is-open::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:50%;
  width:100vw;
  transform:translateX(-50%);
  background:rgba(20,30,40,0.18);
  pointer-events:none;
  z-index:-1;
}

.social-case-visuals{
  border-radius:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}

.social-case-hero{
  border-radius:0 !important;
  box-shadow:none !important;
}

.social-case-hero img{
  border-radius:0 !important;
}

.social-case-panel{
  box-shadow:none !important;
}

.social-case:hover{
  border-radius:0 !important;
  box-shadow:none !important;
}
.social-cases{
  width: 100%;
}

.social-cases .container{
  max-width: 1240px !important;
  width: calc(100% - 80px) !important;
  margin: 0 auto !important;
}

@media (max-width: 768px){
  .social-cases .container{
    width: calc(100% - 32px) !important;
  }
}
/* INTEGRACIÓ PREMIUM DEL PROJECTE OBERT */

.social-case{
  position:relative;
}

/* rebaixar el blanc i negre excessiu */
.social-case-hero img{
  filter: grayscale(18%) contrast(1.04) brightness(0.76) saturate(0.92) !important;
}

/* quan el projecte s'obre, la capçalera passa damunt de la hero */
.social-case.is-open .social-case-toggle{
  position:absolute;
  top:0;
  left:0;
  right:0;
  z-index:8;
  width:100%;
}

/* el text queda superposat sobre la imatge */
.social-case.is-open .social-case-head{
  padding:42px 44px 0 !important;
  background:linear-gradient(
    to bottom,
    rgba(34,53,69,0.92) 0%,
    rgba(34,53,69,0.78) 34%,
    rgba(34,53,69,0.42) 72%,
    rgba(34,53,69,0.00) 100%
  );
}

/* en obert, el panell puja i s'enganxa a dalt */
.social-case.is-open .social-case-panel{
  margin-top:0 !important;
  padding:0 0 40px !important;
}

/* la hero comença des de dalt i reserva espai per al text superposat */
.social-case.is-open .social-case-visuals{
  margin-top:0 !important;
  min-height:660px;
  padding-top:180px;
}

/* fer més protagonista el contingut de text quan és damunt la imatge */
.social-case.is-open .social-case-title{
  font-size:2.15rem !important;
  line-height:1.02;
  opacity:1 !important;
  margin-left:0 !important;
  text-shadow:0 3px 20px rgba(0,0,0,0.22);
}

.social-case.is-open .social-case-copy{
  max-width:720px;
  color:rgba(255,255,255,0.96) !important;
  text-shadow:0 2px 16px rgba(0,0,0,0.20);
}

.social-case.is-open .social-case-channels span{
  color:rgba(255,255,255,0.88) !important;
  text-shadow:0 2px 16px rgba(0,0,0,0.20);
}

/* botó més integrat damunt la imatge */
.social-case.is-open .social-case-plus{
  background:rgba(34,53,69,0.22);
  backdrop-filter:blur(4px);
}

/* mòbils més avall perquè no xoquin amb el text */
.social-case.is-open .social-case-side{
  padding:72px 56px 42px 42px !important;
  align-items:flex-end;
}

/* lleu retard del segon mòbil */
.social-case.is-open .phone-card:last-child{
  transition-delay:.12s;
}

/* la peça oberta ha de respirar com una sola escena */
.social-case.is-open .social-case-visuals::before{
  height:170px !important;
  background:linear-gradient(
    to bottom,
    rgba(34,53,69,0.38) 0%,
    rgba(34,53,69,0.16) 48%,
    rgba(34,53,69,0.00) 100%
  );
}

/* mòbil i tablet */
@media (max-width: 900px){
  .social-case.is-open .social-case-head{
    padding:26px 22px 0 !important;
  }

  .social-case.is-open .social-case-grid{
    grid-template-columns:1fr;
    gap:14px;
  }

  .social-case.is-open .social-case-visuals{
    min-height:560px;
    padding-top:240px;
  }

  .social-case.is-open .social-case-title{
    font-size:1.9rem !important;
  }

  .social-case.is-open .social-case-side{
    padding:26px 22px 20px 22px !important;
  }
}

/* mòbil petit */
@media (max-width: 768px){
  .social-case.is-open .social-case-visuals{
    min-height:500px;
    padding-top:250px;
  }

  .social-case.is-open .social-case-title{
    font-size:1.7rem !important;
  }

  .social-case.is-open .social-case-copy{
    font-size:1rem !important;
    line-height:1.5;
  }
}
/* focus visual quan un projecte està obert */

.social-cases:has(.social-case.is-open) .social-case:not(.is-open){
  opacity:.45;
  transform:scale(.99);
  transition:opacity .35s ease, transform .35s ease;
}

.social-cases:has(.social-case.is-open) .social-case:not(.is-open):hover{
  opacity:.65;
}
/* =========================
   PORTFOLI AUDIOVISUAL
   ========================= */

.audiovisual-page{
  position:relative;
  min-height:100vh;
  padding:56px 0 90px;
  background:
    radial-gradient(circle at 50% 28%, rgba(58,86,108,0.28) 0%, rgba(34,53,69,0.10) 34%, rgba(34,53,69,0.96) 100%),
    #223545;
  overflow:hidden;
}

.audiovisual-nav{
  position:fixed;
  top:360px;
  left:50%;
  transform:translateX(-50%);
  z-index:9999;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:34px;
  padding:0;
  background:transparent;
  box-shadow:none;
  pointer-events:auto;
}

.audiovisual-nav .nav-item{
  color:rgba(255,255,255,0.72);
  font-size:1rem;
  line-height:1;
  cursor:pointer;
  position:relative;
  transition:color .25s ease, opacity .25s ease;
  pointer-events:auto;
}

.audiovisual-nav .nav-item:hover{
  color:#ffffff;
}

.audiovisual-nav .nav-item.active{
  color:#ffffff;
}

.audiovisual-nav .nav-item.active::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-10px;
  margin:auto;
  width:100%;
  height:2px;
  border-radius:999px;
  background:#f3b03f;
}

.audiovisual-mode{
  display:none !important;
  position:relative !important;
  height:100% !important;
  min-height:0 !important;
  overflow:hidden !important;
  flex:1;
}

.audiovisual-mode.active{
  display:block !important;
}

.audiovisual-track{
  position:relative !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  overflow:hidden !important;
}

.audiovisual-slide{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transform:translateY(18px) !important;
  transition:opacity .45s ease, transform .45s ease, visibility .45s ease !important;
}

.audiovisual-slide.active{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transform:translateY(0) !important;
  z-index:2 !important;
}

.audiovisual-videos,
.audiovisual-reels,
.audiovisual-photos{
  overflow:hidden !important;
}

/* VÍDEOS */

.video-stage{
  max-width:1180px;
  margin:0 auto;
  padding:18px 34px 0;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  width:100% !important;
}

.video-item{
  position:relative;
  width:100%;
  max-width:820px;
  margin:0 auto;
  aspect-ratio:16 / 9;
  border-radius:20px;
  overflow:hidden;
  background:#182633;
  box-shadow:
    0 28px 70px rgba(0,0,0,0.22),
    0 14px 28px rgba(0,0,0,0.12);
}

.video-item video{
  width:100% !important;
  height:100% !important;
  display:block !important;
  object-fit:cover !important;
  object-position:center center !important;
  max-width:none !important;
  transform:translateZ(0);
}

.video-item::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:45%;
  background:linear-gradient(to top, rgba(0,0,0,0.55), rgba(0,0,0,0));
  pointer-events:none;
}

.video-caption{
  position:absolute;
  bottom:32px;
  left:34px;
  z-index:5;
  text-align:left;
  margin:0;
  padding:0;
  max-width:none;
}

.video-caption::before{
  display:none;
}

.video-title{
  margin:0 0 4px 0;
  font-family:"Arial Rounded MT";
  font-size:32px;
  font-weight:600;
  line-height:1.04;
  color:#ffffff;
  letter-spacing:-0.2px;
}

.video-subtitle{
  margin:0;
  font-size:15px;
  line-height:1.45;
  color:rgba(255,255,255,0.68);
  letter-spacing:.3px;
}

.video-counter{
  position:absolute;
  top:26px;
  right:32px;
  z-index:10;
  font-family:"Varela Round", sans-serif;
  font-size:14px;
  letter-spacing:2px;
  color:rgba(255,255,255,0.85);
  display:flex;
  align-items:center;
  gap:6px;
  pointer-events:none;
  transition:opacity .4s ease, transform .4s ease;
}

.video-counter::before{
  content:"";
  display:block;
  width:1px;
  height:18px;
  background:rgba(255,255,255,0.28);
  margin-right:10px;
}

.video-current{
  font-weight:600;
  color:rgba(255,255,255,0.96);
}

.video-divider{
  opacity:.5;
}

.video-total{
  opacity:.6;
}

.audiovisual-slide:not(.active) .video-counter{
  opacity:0;
  transform:translateY(-6px);
}

/* FOTOS */

.photo-stage{
  min-height:78vh;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  width:100% !important;
}

.photo-item{
  max-width:980px;
  margin:0 auto;
}

.photo-item img{
width:100%;
display:block;
aspect-ratio:3 / 2;
object-fit:cover;
object-position:center center;
border-radius:28px;
}

.photo-placeholder{
  width:100%;
  aspect-ratio:3 / 2;
  border-radius:28px;
  background:linear-gradient(
    135deg,
    rgba(255,255,255,0.05) 0%,
    rgba(255,255,255,0.02) 100%
  );
}



/* RESPONSIVE */

@media (max-width: 1100px){
  .video-stage,
  .photo-stage{
    padding-left:24px;
    padding-right:24px;
  }
}

@media (max-width: 768px){
  .audiovisual-page{
    padding:54px 0 70px;
  }

  .audiovisual-nav{
    top:150px;
    gap:22px;
    width:max-content;
  }

  .audiovisual-nav .nav-item{
    font-size:.92rem;
  }

  .video-stage,
  .photo-stage{
    padding-left:16px;
    padding-right:16px;
  }

  .video-item,
  .photo-item img,
  .photo-placeholder{
    border-radius:22px;
  }

  .video-caption{
    left:22px;
    bottom:20px;
  }

  .video-title{
    font-size:1.65rem;
  }

  .video-subtitle{
    font-size:.95rem;
  }

  .video-counter{
    top:18px;
    right:20px;
    font-size:12px;
    letter-spacing:1.5px;
  }

  .video-counter::before{
    height:14px;
    margin-right:8px;
  }




/* =========================
   FIX FONS SECCIÓ DESTACATS
   ========================= */

.destacats{
  background:#223545 !important;
  padding-top:40px;
  padding-bottom:90px;
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
}

.destacats .destacat{
  max-width:900px;
  margin:30px auto 22px auto;
}

/* =========================
   MENÚ PREMIUM GLOBAL
   ========================= */

.mm-premium-menu{
  position:fixed;
  top:88px;
  right:42px;
  z-index:999999;
}

.mm-premium-trigger{
  appearance:none;
  -webkit-appearance:none;
  display:flex;
  align-items:center;
  justify-content:center;
  width:104px;
  height:46px;
  padding:0 20px;
  border:1px solid rgba(255,255,255,0.35);
  border-radius:999px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.35);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:
    0 8px 20px rgba(0,0,0,0.15),
    inset 0 1px 0 rgba(255,255,255,0.25);
  cursor:pointer;
  outline:none;
  transition:
    border-color .25s ease,
    background .25s ease,
    transform .25s ease,
    box-shadow .25s ease;
}

.mm-premium-trigger span{
  color:#ffffff;
  font-family:"Arial Rounded MT";
  font-size:14px;
  line-height:1;
  letter-spacing:.08em;
  text-transform:uppercase;
  transition:color .25s ease;
}

.mm-premium-trigger:hover,
.mm-premium-trigger:focus,
.mm-premium-trigger:focus-visible,
.mm-premium-trigger:active,
.mm-premium-trigger[aria-expanded="true"]{
  border-color:#f3b03f;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.04)),
    rgba(34,53,69,0.45);
  box-shadow:
    0 10px 26px rgba(0,0,0,0.22),
    0 0 10px rgba(243,176,63,0.25);
  transform:translateY(-1px);
}

.mm-premium-trigger:hover span,
.mm-premium-trigger:focus span,
.mm-premium-trigger:focus-visible span,
.mm-premium-trigger:active span,
.mm-premium-trigger[aria-expanded="true"] span{
  color:#f3b03f;
}

.mm-premium-trigger,
.mm-premium-trigger *{
  -webkit-tap-highlight-color:transparent;
}

.mm-premium-overlay{
  position:fixed;
  inset:0;
  z-index:999998;
  background:rgba(20,30,40,0.24);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .35s ease, visibility .35s ease;
}

.mm-premium-overlay.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.mm-premium-inner{
  position:relative;
  width:100%;
  height:100%;
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  padding:120px 60px 40px 40px;
}

.mm-premium-panel{
  position:relative;
  width:min(360px, 88vw);
  min-height:560px;
  border-radius:28px;
  border:1px solid rgba(243,176,63,0.55);
  background:
    linear-gradient(145deg, rgba(255,255,255,0.10), rgba(255,255,255,0.03)),
    linear-gradient(180deg, rgba(34,53,69,0.48), rgba(34,53,69,0.36));
  backdrop-filter:blur(28px) saturate(160%);
  -webkit-backdrop-filter:blur(28px) saturate(160%);
  box-shadow:
    0 30px 80px rgba(0,0,0,0.35),
    0 0 18px rgba(243,176,63,0.25),
    inset 0 1px 0 rgba(255,255,255,0.18);
  overflow:hidden;
}

.mm-premium-panel::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 20% 10%, rgba(255,255,255,0.18), transparent 40%);
  opacity:.6;
  pointer-events:none;
}

.mm-premium-panel-content{
  min-height:530px;
  padding:34px 42px 30px;
  display:grid;
  grid-template-rows:1fr auto auto;
  align-items:center;
}

.mm-premium-close{
  position:absolute;
  top:20px;
  right:20px;
  width:46px;
  height:46px;
  padding:0;
  border:1px solid rgba(255,255,255,0.18);
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  color:#ffffff;
  font-size:26px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  outline:none;
  transition:background .25s ease, border-color .25s ease, transform .25s ease, color .25s ease, box-shadow .25s ease;
}

.mm-premium-close:hover{
  color:#f3b03f;
  background:rgba(255,255,255,0.08);
  border-color:#f3b03f;
  box-shadow:0 0 10px rgba(243,176,63,0.35);
  transform:translateY(-1px);
}

.mm-premium-nav{
  width:100%;
  max-width:340px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  text-align:left;
}

.mm-premium-nav,
.mm-premium-nav *,
.mm-menu-item,
.mm-menu-item::before,
.mm-menu-item::after{
  background:transparent !important;
  background-color:transparent !important;
  box-shadow:none !important;
}

.mm-menu-item{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  width:100%;
  padding:22px 0;
}

.mm-menu-item:not(:last-child)::after{
  content:"";
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:1px;
  background:rgba(243,176,63,0.18);
}

.mm-menu-item > a,
.mm-menu-toggle{
  all:unset;
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:"Arial Rounded MT";
  font-size:clamp(1.9rem, 2vw, 2.25rem);
  line-height:1.08;
  letter-spacing:.01em;
  color:rgba(255,255,255,0.92);
  cursor:pointer;
  text-decoration:none;
  transition:color .25s ease, opacity .25s ease;
}

.mm-menu-item > a:hover,
.mm-menu-toggle:hover,
.mm-menu-toggle:focus{
  color:#f3b03f;
  outline:none;
}

.mm-menu-item-collapsible.is-open .mm-menu-toggle{
  color:rgba(255,255,255,0.92);
}

.mm-menu-toggle::after{
  content:"▾";
  font-size:14px;
  color:rgba(243,176,63,0.78);
  transform:translateY(1px);
  transition:transform .25s ease, color .25s ease;
}

.mm-menu-item-collapsible.is-open .mm-menu-toggle::after{
  color:#f3b03f;
  transform:rotate(180deg);
}

.mm-menu-desc{
  width:100%;
  margin-top:6px;
  font-size:12px;
  line-height:1.65;
  letter-spacing:.03em;
  text-align:left;
  color:rgba(243,176,63,0.68);
}

.mm-menu-desc a,
.mm-menu-desc a:hover,
.mm-menu-desc a:focus,
.mm-menu-desc a:active,
.mm-menu-desc a:visited{
  all:unset;
  display:block;
  width:100%;
  cursor:pointer;
  color:rgba(255,255,255,0.88);
  font-size:15px;
  line-height:1.45;
  letter-spacing:.02em;
  text-align:left;
  padding:10px 0;
  text-decoration:none;
  transition:color .25s ease, opacity .25s ease;
}

.mm-menu-desc a:hover{
  color:#ffffff;
  opacity:1;
}

.mm-menu-submenu a:not(:last-child){
  border-bottom:1px solid rgba(255,255,255,0.12);
}

.mm-premium-bottom-links{
  width:100%;
  max-width:340px;
  margin:0 auto;
  padding-top:18px;
  border-top:1px solid rgba(243,176,63,0.14);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
}

.mm-premium-bottom-links a,
.mm-premium-bottom-links a:hover,
.mm-premium-bottom-links a:focus,
.mm-premium-bottom-links a:active,
.mm-premium-bottom-links a:visited{
  all:unset;
  display:inline-block;
  cursor:pointer;
  color:rgba(255,255,255,0.82);
  font-family:"Arial Rounded MT";
  font-size:1.15rem;
  line-height:1.1;
  text-decoration:none;
  transition:color .25s ease, opacity .25s ease;
}

.mm-premium-bottom-links a:hover{
  color:#f3b03f;
  opacity:1;
}

.mm-premium-meta{
  width:100%;
  max-width:340px;
  margin:18px auto 0;
  padding-top:18px;
  border-top:1px solid rgba(243,176,63,0.14);
  display:flex;
  justify-content:flex-start;
  align-items:center;
  gap:28px;
  flex-wrap:wrap;
}

.mm-premium-meta a,
.mm-premium-meta a:hover,
.mm-premium-meta a:focus,
.mm-premium-meta a:active,
.mm-premium-meta a:visited{
  all:unset;
  display:inline-block;
  cursor:pointer;
  font-size:13px;
  color:rgba(255,255,255,0.50);
  letter-spacing:.04em;
  transition:color .25s ease;
}

.mm-premium-meta a:hover{
  color:#f3b03f;
}

body.mm-menu-open{
  overflow:hidden;
}

body:not(.page-id-329) [data-section="section-header-mobile-trigger"]{
  display:none !important;
}

@media (max-width: 921px){
  .mm-premium-menu{
    top:104px;
    right:24px;
  }

  .mm-premium-inner{
    padding:18px;
  }

  .mm-premium-panel{
    width:calc(100vw - 36px);
    min-height:560px;
    border-radius:24px;
  }

  .mm-premium-panel-content{
    min-height:560px;
    padding:70px 26px 28px;
  }

  .mm-premium-nav,
  .mm-premium-bottom-links,
  .mm-premium-meta{
    max-width:100%;
  }

  .mm-menu-item{
    padding:18px 0;
  }

  .mm-menu-item > a,
  .mm-menu-toggle{
    font-size:2rem;
  }

  .mm-menu-desc a{
    font-size:14px;
  }

  .mm-premium-bottom-links a{
    font-size:1.05rem;
  }

  .mm-premium-meta{
    gap:18px;
  }

  .mm-premium-close{
    top:16px;
    right:16px;
    width:42px;
    height:42px;
    font-size:24px;
  }

  .mm-premium-trigger{
    width:112px;
    height:52px;
    padding:0 22px;
  }

  .mm-premium-trigger span{
    font-size:15px;
  }
}
/* MICROAJUST FINAL MENÚ PREMIUM */

.mm-premium-panel{
  width:min(72vw, 400px);
}

.mm-premium-nav{
  position:relative;
  top:-18px;
}

.mm-premium-bottom-links{
  max-width:300px;
  margin:0 auto;
}

.mm-premium-meta{
  justify-content:center;
}

@media (max-width: 921px){
  .mm-premium-panel{
    width:calc(100vw - 36px);
  }

  .mm-premium-nav{
    top:-10px;
  }

  .mm-premium-bottom-links{
    margin-top:10px;
  }

  .mm-premium-meta{
    margin-top:12px;
  }
}
/* PUJAR BLOC PRINCIPAL DEL MENÚ */

.mm-premium-nav{
  position:relative;
  top:-40px;
}

@media (max-width: 921px){
  .mm-premium-nav{
    top:-24px;
  }
}
/* AJUST FINAL NET MENÚ PREMIUM */

.mm-premium-panel{
  width:min(340px, 88vw);
}

.mm-premium-nav{
  position:relative;
  top:-14px;
}

.mm-premium-bottom-links{
  max-width:300px;
  margin:0 auto;
}

.mm-premium-meta{
  justify-content:center;
}

.mm-premium-nav .mm-menu-item > a,
.mm-premium-nav .mm-menu-toggle{
  font-size:1.7rem !important;
}

@media (max-width: 921px){
  .mm-premium-panel{
    width:calc(100vw - 36px);
  }

  .mm-premium-nav{
    top:-8px;
  }

  .mm-premium-bottom-links{
    margin-top:10px;
  }

  .mm-premium-meta{
    margin-top:12px;
  }

  .mm-premium-nav .mm-menu-item > a,
  .mm-premium-nav .mm-menu-toggle{
    font-size:1.55rem !important;
  }
}
.mm-premium-close:hover{
  color:#f3b03f !important;
  border-color:#f3b03f !important;
  box-shadow:0 0 10px rgba(243,176,63,0.35);
}
/* fer el botó MENU més petit sense trencar el layout */

.mm-premium-trigger{
  transform:scale(0.72);
  transform-origin:right center;
}

.mm-premium-trigger:hover,
.mm-premium-trigger:focus,
.mm-premium-trigger:focus-visible,
.mm-premium-trigger:active,
.mm-premium-trigger[aria-expanded="true"]{
  border-color:#f3b03f;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.04)),
    rgba(34,53,69,0.45);
  box-shadow:
    0 10px 26px rgba(0,0,0,0.22),
    0 0 10px rgba(243,176,63,0.25);
  transform:scale(0.72) translateY(-1px);
}
/* =========================
   CLIENTS DESTACATS PREMIUM
   ========================= */

.client-premium-card{

  position:relative;
  overflow:hidden;
  border-radius:28px;

  border:1px solid rgba(243,176,63,0.55);

  background:
    linear-gradient(145deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.35);

  backdrop-filter:blur(16px) saturate(150%);
  -webkit-backdrop-filter:blur(16px) saturate(150%);

  box-shadow:
    0 20px 50px rgba(0,0,0,0.25),
    inset 0 1px 0 rgba(255,255,255,0.18);

  transition:
    transform .35s ease,
    box-shadow .35s ease,
    border-color .35s ease;

}

/* glow suau com el menú */

.client-premium-card:hover{

  transform:translateY(-4px);

  border-color:#f3b03f;

  box-shadow:
    0 30px 80px rgba(0,0,0,0.35),
    0 0 18px rgba(243,176,63,0.25),
    inset 0 1px 0 rgba(255,255,255,0.25);

}

/* efecte llum premium */

.client-premium-card::before{

  content:"";
  position:absolute;
  inset:0;

  background:
    radial-gradient(circle at 20% 10%, rgba(255,255,255,0.10), transparent 45%);

  opacity:.35;
  pointer-events:none;
}

/* =========================
   REDUIR MIDA CLIENTS PREMIUM
   ========================= */

.clients-premium-grid{
  gap:28px; /* abans segurament és més gran */
}

.client-premium-card{
  max-height:420px; /* limita l'alçada */
}

.client-premium-card img{
  height:260px;
  object-fit:cover;
}
/* =========================
   CORRECCIÓ FADE CARTES
   ========================= */

.client-premium-card{
  position:relative;
  overflow:hidden;
}

/* imatge ocupa tota la carta */

.client-premium-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* degradat premium sobre la imatge */

.client-premium-card::after{
  content:"";
  position:absolute;
  inset:0;

  background:
    linear-gradient(
      to bottom,
      rgba(34,53,69,0) 35%,
      rgba(34,53,69,0.35) 55%,
      rgba(34,53,69,0.75) 100%
    );

  pointer-events:none;
}
/* =========================
   CORREGIR CENTRAT CARTES
   ========================= */

.destacats .destacat{
  position:relative;
  overflow:hidden;
  max-width:1050px;
  margin:40px auto;
  padding:64px 64px;
  border-radius:34px;
}

/* imatge ocupa tota la carta */

.client-premium-card img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
/* =========================
   FIX CENTRAT CLIENTS PREMIUM
   ========================= */

.clients-premium-grid{
  max-width:900px;
  margin:0 auto;
  padding:0;
  gap:22px;
}

.client-premium-card{
  width:100%;
  max-width:900px;
  margin:0 auto;
  aspect-ratio:16/8;
  position:relative;
  overflow:hidden;
}

/* totes les cartes exactament iguals */
.client-premium-card:first-child{
  aspect-ratio:16/8;
}

/* imatge ocupa tota la carta */
.client-premium-card img,
.client-premium-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
/* =========================
   REDUIR LOGOS CLIENTS
   ========================= */

/* reduir només el logo dels clients */

.client-premium-logo{
  width:140px;
  height:auto;
}

.client-premium-card .client-premium-logo img{
  width:120px;
  height:auto;
  object-fit:contain;
}
/* LOGOS DELS CLIENTS MÉS PETITS */
.client-premium-logo{
  top:22px !important;
  left:22px !important;
  max-width:150px !important;
  max-height:58px !important;
  width:auto !important;
  height:auto !important;
}

.client-premium-logo img{
  max-width:150px !important;
  max-height:58px !important;
  width:auto !important;
  height:auto !important;
  object-fit:contain !important;
}

/* =========================
   TARGETES HOME GLOW PREMIUM
   ========================= */

.destacats{
  background:#223545 !important;
  padding:40px 0 90px;
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
}

.destacats .destacat{
  position:relative;
  overflow:hidden;
  max-width:500px;
  margin:34px auto 22px;
  padding:52px 54px 46px;
  border-radius:34px;

  background:
    linear-gradient(145deg, rgba(255,255,255,0.09), rgba(255,255,255,0.02)),
    linear-gradient(180deg, rgba(39,63,82,0.88), rgba(29,48,64,0.92)) !important;

  border:1px solid rgba(243,176,63,0.42);

  backdrop-filter:blur(16px) saturate(145%);
  -webkit-backdrop-filter:blur(16px) saturate(145%);

  box-shadow:
    0 20px 55px rgba(0,0,0,0.22),
    0 0 18px rgba(243,176,63,0.10),
    inset 0 1px 0 rgba(255,255,255,0.14);

  transition:
    transform .32s ease,
    box-shadow .32s ease,
    border-color .32s ease,
    background .32s ease;
}

/* glow subtil */
.destacats .destacat:hover{
  transform:translateY(-4px);
  border-color:rgba(243,176,63,0.72);
  box-shadow:
    0 35px 80px rgba(0,0,0,0.32),
    0 0 28px rgba(243,176,63,0.30),
    inset 0 1px 0 rgba(255,255,255,0.20);
}

/* llum superior suau */
.destacats .destacat::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 10%, rgba(255,255,255,0.16), transparent 32%);
  opacity:.7;
}

/* peça decorativa superior esquerra */
.destacats .destacat::after{
  content:"";
  position:absolute;
  top:22px;
  left:22px;
  width:30px;
height:7px;
  border-radius:20px;
  background:#f3b03f;
box-shadow:
0 0 10px rgba(243,176,63,0.25),
0 1px 0 rgba(255,255,255,0.25) inset;
}

/* amagar la peça antiga */
.destacats .destacat .separador{
  display:none !important;
}

/* títol */
.destacats .destacat h3{
  margin-top:20px;
  margin-bottom:16px;
  color:#ffffff !important;
  text-align:left;
  font-family:"Arial Rounded MT";
  font-size:28px;
  line-height:1.15;
  text-transform:uppercase;
  letter-spacing:0.01em;
  font-weight:600;
}

/* text */
.destacats .destacat p{
  color:rgba(255,255,255,0.88) !important;
  font-size:17px;
  line-height:1.55;
  font-weight:normal;
  max-width:560px;
  margin:0;
  opacity:0.9;
}

/* text inferior */
.destacats .text-inferior{
  max-width:760px;
  margin:0 auto;
  color:rgba(255,255,255,0.72);
  font-size:1.2rem;
  line-height:1.5;
}

/* anul·lar qualsevol variant antiga de color */
.destacats .destacat.green,
.destacats .destacat.pink,
.destacats .destacat.yellow{
  background:
    linear-gradient(145deg, rgba(255,255,255,0.09), rgba(255,255,255,0.02)),
    linear-gradient(180deg, rgba(39,63,82,0.88), rgba(29,48,64,0.92)) !important;
}

/* mòbil */
@media (max-width:768px){
  .destacats{
    padding:26px 16px 60px;
  }

  .destacats .destacat{
    max-width:100%;
    margin:18px auto 16px;
    padding:30px 26px 28px;
    border-radius:28px;
  }

  .destacats .destacat::after{
    top:18px;
    left:18px;
    width:46px;
    height:8px;
  }

  .destacats .destacat h3{
    margin-top:40px;
    margin-bottom:14px;
    font-size:2rem !important;
    line-height:1.08;
  }

  .destacats .destacat p{
    max-width:100%;
    font-size:1.2rem !important;
    line-height:1.35;
  }

  .destacats .text-inferior{
    font-size:1rem;
    line-height:1.45;
  }
}
/* =========================
   UNIFICAR FONS HOME
   ========================= */

.home,
.home #primary,
.home .site-content,
.home .entry-content,
.home .top-home,
.home .millennials,
.home .support,
.home .destacats,
.home .estrategies,
.home .galeria,
.home .clients,
.home .video,
.home .values-premium,
.home .clients-premium{
  background:#223545 !important;
  background-image:none !important;
}
/* =========================
   LÍNIA BLANCA ENTRE HERO I FRANJA VERDA
   ========================= */

.home .home-hero{
border-top:none !important;
}
/* =========================
   AMAGAR PROJECTES DESTACATS HOME
   ========================= */

.home .clients-premium{
  display:none !important;
}
/* =========================
   FRANJA CLIENTS HOME
   ========================= */

.clients-marquee{
  width:100%;
  overflow:hidden;
  padding:18px 0 8px;
  background:transparent;
}

.clients-marquee-inner{
  display:flex;
  align-items:center;
  gap:72px;
  width:max-content;
  animation:clientsScroll 26s linear infinite;
}

.clients-marquee a{
  display:inline-flex;
  align-items:center;
}

.clients-marquee img{
  height:34px;
  width:auto;
  opacity:.78;
  transition:opacity .3s ease;
}

.clients-marquee a:hover img,
.clients-marquee img:hover{
  opacity:1;
}

@keyframes clientsScroll{
  0%{
    transform:translateX(0);
  }
  100%{
    transform:translateX(-50%);
  }
}

@media (max-width:768px){
  .clients-marquee{
    padding:14px 0 4px;
  }

  .clients-marquee-inner{
    gap:42px;
  }

  .clients-marquee img{
    height:24px;
  }
}
/* =========================
   AMAGAR SECCIÓ ESTRATÈGIES A LA HOME
   ========================= */

.home .estrategies{
  display:none !important;
}
/* =========================
   SECCIÓ EQUIP FONS FOSC
   ========================= */

.home .equip{
  background:#223545;
  color:#ffffff;
}

/* noms */

.home .equip .person h4{
  color:#ffffff;
}

/* descripció */

.home .equip .person p{
  color:#e6eef2;
}
.home .equip{
  background:#223545;
  color:#ffffff;
  padding:80px 0;
}
/* =========================
   SECCIÓ EQUIP ESTIL PREMIUM
   ========================= */

.home .equip{
  background:#223545;
  color:#ffffff;
  padding:90px 0;
}

/* grid més equilibrat */

.home .equip .grid{
  max-width:1100px;
  margin:0 auto;
  gap:70px;
}

/* targeta persona */

.home .equip .person{
  text-align:center;
  max-width:280px;
  margin:0 auto;
}

/* nom */

.home .equip .person h4{
  color:#ffffff;
  font-size:28px;
  font-weight:600;
  margin-bottom:12px;
  letter-spacing:.02em;
}

/* petita línia sota el nom */

.home .equip .person h4:after{
  content:"";
  display:block;
  width:26px;
  height:3px;
  background:#6fa79c;
  margin:10px auto 18px;
  border-radius:2px;
}

/* descripció */

.home .equip .person p{
  color:#c9d6dc;
  font-size:15px;
  line-height:1.6;
  max-width:240px;
  margin:0 auto;
}
/* =========================
   TREURE LOGO A LA SECCIÓ EQUIP
   ========================= */

.home .millennials .title .millennials{
  display:none;
}

/* =========================
   EQUIP PREMIUM HOME
   ========================= */

/* bloc general */
.home .equip{
  background:#223545 !important;
  color:#ffffff;
  padding:100px 0 110px;
}

/* amagar logo redundant de Millennials abans de l'equip */
.home .millennials .title .millennials{
  display:none !important;
}

/* contenidor del títol "equip" */
.home .millennials{
  background:#223545 !important;
  padding:30px 0 10px;
}

.home .millennials .title{
  max-width:none;
  margin:0 auto;
  padding:0;
  text-align:center;
  color:#f3b03f;
  font-family:"Varela Round";
  font-size:20px;
  font-weight:normal;
  letter-spacing:.08em;
  text-transform:uppercase;
  position:relative;
}

/* línia premium sota el títol */
.home .millennials .title::after{
  content:"";
  display:block;
  width:54px;
  height:2px;
  margin:16px auto 0;
  border-radius:999px;
  background:rgba(243,176,63,0.72);
}

/* grid */
.home .equip .grid{
  max-width:1080px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:64px 54px;
  align-items:start;
}

/* peça */
.home .equip .person{
  text-align:center;
  max-width:250px;
  margin:0 auto;
  color:#ffffff;
}

/* nom */
.home .equip .person h4{
  font-family:"Arial Rounded MT";
  font-size:30px;
  line-height:1.08;
  font-weight:600;
  color:#ffffff !important;
  margin:0 0 10px;
  letter-spacing:.01em;
}

/* línia sota nom */
.home .equip .person h4::after{
content:"";
display:block;
width:24px;
height:3px;
margin:12px auto 0;
border-radius:999px;
background:#f3b03f;
opacity:.9;
}

/* descripció */
.home .equip .person p{
  margin:0;
  font-family:"Varela Round";
  font-size:16px;
  line-height:1.65;
  color:rgba(255,255,255,0.78) !important;
  max-width:230px;
  margin-left:auto;
  margin-right:auto;
}

/* si hi ha enllaços o format dins del text */
.home .equip .person p a{
  color:rgba(255,255,255,0.78) !important;
  text-decoration:none;
}

/* suavitzar qualsevol verd massa intens heretat */
.home .equip .person,
.home .equip .person *{
  box-shadow:none !important;
}

/* responsive tablet */
@media (max-width: 980px){
  .home .equip{
    padding:80px 20px 90px;
  }

  .home .equip .grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:54px 34px;
    max-width:760px;
  }

  .home .equip .person h4{
    font-size:27px;
  }

  .home .equip .person p{
    font-size:15px;
    max-width:220px;
  }
}

/* responsive mòbil */
@media (max-width: 768px){
  .home .millennials{
    padding:20px 16px 6px;
  }

  .home .millennials .title{
    font-size:17px;
    letter-spacing:.06em;
  }

  .home .millennials .title::after{
    width:42px;
    margin-top:12px;
  }

  .home .equip{
    padding:56px 16px 70px;
  }

  .home .equip .grid{
    grid-template-columns:1fr;
    gap:42px;
    max-width:340px;
  }

  .home .equip .person{
    max-width:100%;
  }

  .home .equip .person h4{
    font-size:24px;
    margin-bottom:8px;
  }

  .home .equip .person h4::after{
    width:20px;
    margin-top:10px;
  }

  .home .equip .person p{
    font-size:15px;
    line-height:1.55;
    max-width:260px;
  }
}
/* =========================
   CENTRAR TÍTOL EQUIP
   ========================= */

.home .millennials .title .container{
  text-align:center !important;
}

.home .millennials .title{
  text-align:center !important;
}
/* =========================
   AMAGAR SUPORT A LA HOME
   ========================= */

.home .support{
  display:none !important;
}
/* =========================
   POSICIÓ ICONES XARXES
   ========================= */

.hero-social{
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:28px;

  margin-top:140px;
  margin-bottom:120px;

  opacity:.85;
}

/* mida icones */

.hero-social img{
  width:12px;
  height:auto;
  opacity:.8;
  transition:opacity .25s ease, transform .25s ease;
}

.hero-social a:hover img{
  opacity:1;
  transform:translateY(-2px);
}
/* =========================
   AJUST HERO + VALORS
   ========================= */

.hero-social{
  margin-top:120px !important;
  margin-bottom:50px !important;
}

.values-premium{
  padding:40px 0 90px !important;
  margin-top:0 !important;
}
/* mateix fons que la resta de la home */

.millennials-bottom{
  background:#223545 !important;
}
/* =========================
   FOOTER PREMIUM VIDRE
   ========================= */

.site-above-footer-wrap{
  background:#223545 !important;
  position:relative;
  padding:60px 0 !important;

  /* efecte vidre */
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  background:rgba(34,53,69,0.85) !important;

  /* línia superior subtil */
  border-top:1px solid rgba(255,255,255,0.08);
}

/* treure colors interns del tema */

.site-footer-above-section-1,
.site-footer-above-section-2,
.site-footer-above-section-3{
  background:transparent !important;
}

/* widgets nets */

.site-above-footer-wrap .widget{
  background:transparent !important;
  box-shadow:none !important;
  border:none !important;
}

/* icones socials més premium */

.site-above-footer-wrap .ast-builder-social-element{
  border:1px solid rgba(255,255,255,0.15);
  backdrop-filter: blur(6px);
  transition:all .25s ease;
}

.site-above-footer-wrap .ast-builder-social-element:hover{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,0.35);
}
/* =========================
   FOOTER PREMIUM INTEGRAT
   ========================= */

.footer-premium{

  /* mateix color que el fons */
  background:rgba(34,53,69,0.60);

  backdrop-filter:blur(16px) saturate(130%);
  -webkit-backdrop-filter:blur(16px) saturate(130%);

  border:1px solid rgba(243,176,63,0.25);

  border-radius:28px;

  padding:42px 60px !important;

  /* glow molt més subtil */
  box-shadow:
  0 0 8px rgba(243,176,63,0.10),
  0 0 20px rgba(243,176,63,0.05),
  0 20px 40px rgba(0,0,0,0.35),
  inset 0 1px 0 rgba(255,255,255,0.10);
}
/* =========================
   LIGHT FOLLOW EFFECT
   ========================= */

.footer-premium{
  position:relative;
  overflow:hidden;
}

.footer-premium::before{
  content:"";
  position:absolute;
  inset:-220px;

  background:radial-gradient(
    circle at var(--x,50%) var(--y,50%),
    rgba(243,176,63,0.06),
    transparent 50%
  );

  pointer-events:none;
  transition:opacity .2s ease;
  opacity:.5;
}
/* =========================
   CURSOR LIGHT HOME
   ========================= */

.home .cursor-light-home{
  position:fixed;
  top:0;
  left:0;
  width:100vw;
  height:100vh;
  pointer-events:none;
  z-index:999;
  opacity:1;
  mix-blend-mode:screen;

  background:radial-gradient(
    70px circle at var(--cursor-x, 50vw) var(--cursor-y, 50vh),
    rgba(243,176,63,0.12) 0%,
    rgba(243,176,63,0.06) 30%,
    rgba(243,176,63,0.00) 70%
  );
}

/* perquè el contingut segueixi sent clicable i visible */

.home .site-header,
.home #primary,
.home .site-footer{
  position:relative;
  z-index:1;
}

/* =========================
   CURSOR MILLENNIALS
   ========================= */

.cursor-m{
  position:fixed;
  top:0;
  left:0;
  width:20px;
  height:20px;
  pointer-events:none;
  z-index:99999;
  transform:translate(-50%,-50%);
  background-image:url("http://millennialsturisme.cat/wp-content/uploads/2026/03/cursor.png");
  background-size:contain;
  background-repeat:no-repeat;
  background-position:center;
  transition:transform .18s ease, filter .18s ease;
}

/* amagar cursor del navegador */

body.cursor-m-active,
body.cursor-m-active *{
  cursor:none !important;
}

/* =========================
   EFECTE HOVER CURSOR
   ========================= */

body.cursor-hover .cursor-m{
  transform:translate(-50%,-50%) scale(1.3) rotate(8deg);
  filter:drop-shadow(0 0 6px rgba(243,176,63,0.7));
}
/* compactació real del menú dret del footer */

.footer-right{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  align-items:flex-end !important;
  gap:5px !important;
  min-width:auto !important;
  height:auto !important;
}

.footer-right > *{
  margin:0 !important;
}

.footer-right a{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  line-height:1.15 !important;
  font-size:0.95rem !important;
  text-align:right !important;
  white-space:nowrap;
}

.footer-right a + a{
  margin-top:0 !important;
}

.footer-right p,
.footer-right div{
  margin:0 !important;
  padding:0 !important;
}
.footer-right a{
  color:#ffffff;
  transition:color 0.25s ease, transform 0.25s ease;
}

.footer-right a:hover{
  color:#f3b03f;
  transform:translateX(-3px);
}
/* =========================
   FILTRES PROJECTES PREMIUM
   ========================= */

.projects-filters{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  margin:0 auto 40px auto;
  padding:0;
}

.projects-filter{
  appearance:none;
  -webkit-appearance:none;
  border:1px solid rgba(255,255,255,0.28);
  border-radius:999px;

  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.34);

  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);

  box-shadow:
    0 8px 20px rgba(0,0,0,0.16),
    inset 0 1px 0 rgba(255,255,255,0.18);

  color:rgba(255,255,255,0.92);

  font-family:"Arial Rounded MT";
  font-size:0.9rem;
  line-height:1;

  padding:12px 22px;
  min-height:42px;

  cursor:pointer;

  transition:
    border-color .25s ease,
    background .25s ease,
    color .25s ease,
    transform .25s ease,
    box-shadow .25s ease;
}

.projects-filter:hover{
  border-color:#f3b03f;
  color:#f3b03f;

  background:
    linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.04)),
    rgba(34,53,69,0.44);

  box-shadow:
    0 10px 26px rgba(0,0,0,0.22),
    0 0 10px rgba(243,176,63,0.16);

  transform:translateY(-1px);
}

.projects-filter:focus{
  outline:none;
  border-color:#f3b03f;
  color:#f3b03f;
}

.projects-filter.active{
  border-color:rgba(243,176,63,0.72);
  color:#f3b03f;

  background:
    linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.04)),
    rgba(34,53,69,0.46);

  box-shadow:
    0 12px 30px rgba(0,0,0,0.24),
    0 0 14px rgba(243,176,63,0.18),
    inset 0 1px 0 rgba(255,255,255,0.22);
}

@media (max-width:768px){

  .projects-filters{
    gap:8px;
    margin:0 auto 28px auto;
  }

  .projects-filter{
    font-size:0.85rem;
    padding:10px 18px;
    min-height:38px;
  }

}
/* =========================
   UNIFICAR FONS PÀGINA PROJECTES
   ========================= */

.page-id-103,
.page-id-103 #primary,
.page-id-103 .site-content,
.page-id-103 .entry-content,
.page-id-103 .site-main,
.page-id-103 .top-home,
.page-id-103 .social-cases{
  background:#223545 !important;
  background-image:none !important;
}
/* =========================
   LÍNIA GROGA A PROJECTES
   ========================= */

.page-id-103 .top-home:after{
  background:#f3b03f !important;
  height:2px;
  opacity:0.85;
}
/* =========================
   CORRECCIÓ LÍNIA HEADER PROJECTES
   ========================= */

.page-id-103 a.logo{
  border-bottom:1px solid rgba(243,176,63,0.75) !important;
}

.page-id-103 .top-home{
  border-bottom:none !important;
}

.page-id-103 .site-header,
.page-id-103 #masthead,
.page-id-103 .main-header-bar{
  border-bottom:none !important;
  box-shadow:none !important;
}
/* =========================
   LÍNIA DIFUMINADA PROJECTES
   ========================= */

.page-id-103 a.logo{
  position:relative;
  border-bottom:none !important;
  padding:12px 0;
}

.page-id-103 a.logo:after{
  content:"";
  position:absolute;
  left:0;
  bottom:-1px;
  width:100%;
  height:2px;
opacity:0.4;

  background:linear-gradient(
    90deg,
    rgba(243,176,63,0) 0%,
    rgba(243,176,63,0.7) 50%,
    rgba(243,176,63,0) 100%
  );
}
/* =========================
   LOGO PROJECTES OPTIMITZAT
   ========================= */

.page-id-103 a.logo{
  padding:10px 0;
}

.page-id-103 a.logo img{
  max-width:300px;
  height:auto;
}
/* =========================
   AJUST ESPAI SUPERIOR PROJECTES
   ========================= */

.page-id-103 .social-cases{
  padding:20px 0 60px !important;
}

/* =========================
   CONTACTE HOME PREMIUM
   ========================= */

.home-contact-cta-wrap{
  background:#223545;
  padding:70px 20px 95px;
  display:flex;
  justify-content:center;
  align-items:center;
}

.home-contact-trigger,
.home-contact-submit{
  appearance:none;
  -webkit-appearance:none;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:104px;
  height:46px;
  padding:0 20px;
  border:1px solid rgba(255,255,255,0.35);
  border-radius:999px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.35);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:
    0 8px 20px rgba(0,0,0,0.15),
    inset 0 1px 0 rgba(255,255,255,0.25);
  cursor:pointer;
  outline:none;
  transition:
    border-color .25s ease,
    background .25s ease,
    transform .25s ease,
    box-shadow .25s ease,
    color .25s ease;
}

.home-contact-trigger span,
.home-contact-submit span{
  color:#ffffff;
  font-family:"Arial Rounded MT";
  font-size:14px;
  line-height:1;
  letter-spacing:.08em;
  text-transform:uppercase;
  transition:color .25s ease;
}

.home-contact-trigger:hover,
.home-contact-trigger:focus,
.home-contact-submit:hover,
.home-contact-submit:focus{
  border-color:#f3b03f;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.04)),
    rgba(34,53,69,0.45);
  box-shadow:
    0 10px 26px rgba(0,0,0,0.22),
    0 0 10px rgba(243,176,63,0.25);
  transform:translateY(-1px);
}

.home-contact-trigger:hover span,
.home-contact-trigger:focus span,
.home-contact-submit:hover span,
.home-contact-submit:focus span{
  color:#f3b03f;
}

.home-contact-modal{
  position:fixed;
  inset:0;
  z-index:999999;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .3s ease, visibility .3s ease;
}

.home-contact-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.home-contact-overlay{
  position:absolute;
  inset:0;
  background:rgba(20,30,40,0.34);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

.home-contact-panel{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  width:min(560px, calc(100vw - 32px));
  border-radius:28px;
  border:1px solid rgba(243,176,63,0.45);
  background:
    linear-gradient(145deg, rgba(255,255,255,0.10), rgba(255,255,255,0.03)),
    linear-gradient(180deg, rgba(34,53,69,0.60), rgba(34,53,69,0.42));
  backdrop-filter:blur(28px) saturate(160%);
  -webkit-backdrop-filter:blur(28px) saturate(160%);
  box-shadow:
    0 30px 80px rgba(0,0,0,0.35),
    0 0 18px rgba(243,176,63,0.18),
    inset 0 1px 0 rgba(255,255,255,0.18);
  overflow:hidden;
}

.home-contact-panel::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 20% 10%, rgba(255,255,255,0.16), transparent 40%);
  opacity:.55;
  pointer-events:none;
}

.home-contact-panel-inner{
  position:relative;
  z-index:2;
  padding:44px 34px 34px;
}

.home-contact-close{
  position:absolute;
  top:18px;
  right:18px;
  z-index:3;
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,0.18);
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  color:#ffffff;
  font-size:24px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:all .25s ease;
}

.home-contact-close:hover{
  color:#f3b03f;
  border-color:#f3b03f;
  background:rgba(255,255,255,0.08);
  box-shadow:0 0 10px rgba(243,176,63,0.22);
}

.home-contact-panel h3{
  margin:0 0 26px;
  color:#ffffff;
  font-family:"Arial Rounded MT";
  font-size:2rem;
  line-height:1.05;
  text-align:left;
}

.home-contact-form{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.home-contact-field{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.home-contact-field label{
  color:rgba(255,255,255,0.78);
  font-size:0.95rem;
  line-height:1.2;
}

.home-contact-field input,
.home-contact-field textarea{
  width:100%;
  border:1px solid rgba(255,255,255,0.14);
  border-radius:18px;
  background:rgba(255,255,255,0.06);
  color:#ffffff;
  font-family:"Varela Round", sans-serif;
  font-size:1rem;
  line-height:1.5;
  padding:16px 18px;
  outline:none;
  box-shadow:none;
  transition:border-color .25s ease, background .25s ease, box-shadow .25s ease;
}

.home-contact-field input:focus,
.home-contact-field textarea:focus{
  border-color:rgba(243,176,63,0.55);
  background:rgba(255,255,255,0.08);
  box-shadow:0 0 0 3px rgba(243,176,63,0.08);
}

.home-contact-field textarea{
  min-height:150px;
  resize:vertical;
}

.home-contact-submit{
  margin-top:6px;
  align-self:flex-start;
}

body.home-contact-open{
  overflow:hidden;
}

@media (max-width:768px){
  .home-contact-cta-wrap{
    padding:50px 16px 70px;
  }

  .home-contact-panel-inner{
    padding:34px 22px 24px;
  }

  .home-contact-panel h3{
    font-size:1.7rem;
    margin-bottom:22px;
  }

  .home-contact-trigger,
  .home-contact-submit{
    min-width:96px;
    height:42px;
    padding:0 18px;
  }

  .home-contact-trigger span,
  .home-contact-submit span{
    font-size:13px;
  }
}
/* COLOR TEXT FORMULARI CONTACTE */

.home-contact-form input,
.home-contact-form textarea{
  color:#ffffff !important;
  opacity:1 !important;
}

/* camp email específic */
.home-contact-form input[type="email"]{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  opacity:1 !important;
}

/* quan escrius */
.home-contact-form input[type="email"]:focus,
.home-contact-form textarea:focus{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}

/* autofill Chrome / Safari */
.home-contact-form input[type="email"]:-webkit-autofill,
.home-contact-form input[type="email"]:-webkit-autofill:hover,
.home-contact-form input[type="email"]:-webkit-autofill:focus{
  -webkit-text-fill-color:#ffffff !important;
  transition: background-color 9999s ease-in-out 0s;
  box-shadow:0 0 0px 1000px transparent inset !important;
}
.home-contact-feedback{
  margin:14px 0 0;
  font-size:15px;
  line-height:1.4;
  min-height:22px;
  color:rgba(255,255,255,0.72);
}

.home-contact-feedback.is-success{
  color:#f3b03f;
}

.home-contact-feedback.is-error{
  color:#ff8f8f;
}

.home-contact-submit:disabled{
  opacity:.65;
  cursor:wait;
}
.hero-contact{
  position:absolute;
  top:54px;
  left:60px;
  z-index:40;
}

.hero-contact .home-contact-trigger{
  transform:scale(0.72);
  transform-origin:left center;
  backdrop-filter:blur(6px);
  box-shadow:0 6px 18px rgba(0,0,0,0.15);
  transition:all .25s ease;
}

.hero-contact .home-contact-trigger:hover,
.hero-contact .home-contact-trigger:focus,
.hero-contact .home-contact-trigger:focus-visible,
.hero-contact .home-contact-trigger:active{
  transform:scale(0.72) translateY(-2px);
  box-shadow:0 10px 28px rgba(0,0,0,0.22);
}
.hero-contact .home-contact-trigger span{
  letter-spacing:.08em;
}
.hero-contact .home-contact-trigger span{
  font-size:12px;
  letter-spacing:.12em;
}

.hero-contact .home-contact-trigger{
  padding:12px 22px;
}
.home-contact-cta-wrap .home-contact-trigger{
  transform:none !important;
  padding:20px 42px !important;
}

.home-contact-cta-wrap .home-contact-trigger{
  padding:20px 46px !important;
  border-width:1.5px;
}

.home-contact-cta-wrap .home-contact-trigger span{
  font-size:11px !important;
  letter-spacing:.18em;
}
}

@media (max-width: 768px){
  .hero-contact{
    top:20px;
    left:18px;
  }
}
/* =========================
   CURSOR PER DAMUNT DEL MENÚ
   ========================= */

.cursor-m{
  z-index:1000001 !important;
}
/* =========================
   SUBMENÚ MENU ULTRA SUAU
   ========================= */

.mm-menu-item-collapsible{
  transition:padding .65s cubic-bezier(.16,.84,.44,1);
}

.mm-menu-submenu{
  display:block;
  max-height:0;
  opacity:0;
  overflow:hidden;
  transform:translateY(-3px);
  margin-top:0;
  transition:
    max-height 1.05s cubic-bezier(.16,.84,.44,1),
    opacity .55s ease,
    transform .55s ease,
    margin-top .65s cubic-bezier(.16,.84,.44,1);
  will-change:max-height, opacity, transform;
}

.mm-menu-item-collapsible.is-open .mm-menu-submenu{
  max-height:260px;
  opacity:1;
  transform:translateY(0);
  margin-top:10px;
}
/* =========================
   VIDRE FONS CONTACTE SUAU
   ========================= */

.home-contact-overlay{
  position:absolute;
  inset:0;
  background:rgba(20,30,40,0.35);
  backdrop-filter:blur(10px);
  opacity:0;
  transition:opacity .6s cubic-bezier(.22,.61,.36,1);
}

.home-contact-modal.is-open .home-contact-overlay{
  opacity:1;
}

/* =========================
   CONTACTE · MATEIX MODEL DEL HERO
   però robust en totes les pantalles
   ========================= */

.home-contact-modal{
  position:fixed;
  inset:0;
  z-index:999999;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:20px !important;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .3s ease, visibility .3s ease;
}

.home-contact-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.home-contact-overlay{
  position:absolute;
  inset:0;
  background:rgba(20,30,40,0.34);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  opacity:1 !important;
}

.home-contact-panel{
  position:relative !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  transform:none !important;

  width:min(560px, calc(100vw - 32px)) !important;
  max-height:calc(100dvh - 40px) !important;

  border-radius:28px;
  overflow:hidden !important;

  display:flex !important;
  flex-direction:column !important;
  z-index:2 !important;
}

.home-contact-panel-inner{
  position:relative;
  z-index:2;
  padding:44px 34px 34px;
  overflow-y:auto !important;
  max-height:calc(100dvh - 40px) !important;
  -webkit-overflow-scrolling:touch;
}

/* desktop baixet */
@media (max-height:760px){
  .home-contact-panel{
    max-height:calc(100dvh - 24px) !important;
  }

  .home-contact-panel-inner{
    max-height:calc(100dvh - 24px) !important;
    padding:34px 28px 26px !important;
  }

  .home-contact-field textarea{
    min-height:120px !important;
  }
}

/* mòbil: mateix efecte blur, però panell millor encaixat */
@media (max-width:768px){

  .home-contact-modal{
    padding:14px !important;
    align-items:center !important;
    justify-content:center !important;
  }

  .home-contact-panel{
    width:min(560px, calc(100vw - 28px)) !important;
    max-height:calc(100dvh - 28px) !important;
    border-radius:24px !important;
  }

  .home-contact-panel-inner{
    max-height:calc(100dvh - 28px) !important;
    padding:30px 20px 22px !important;
  }

  .home-contact-panel h3{
    font-size:1.55rem !important;
    margin:0 0 18px !important;
    padding-right:54px !important;
  }

  .home-contact-close{
    top:14px !important;
    right:14px !important;
    width:40px !important;
    height:40px !important;
  }

  .home-contact-field input,
  .home-contact-field textarea{
    padding:14px 16px !important;
  }

  .home-contact-field textarea{
    min-height:110px !important;
  }
}

/* pantalles molt baixes */
@media (max-width:768px) and (max-height:700px){

  .home-contact-modal{
    padding:10px !important;
  }

  .home-contact-panel{
    max-height:calc(100dvh - 20px) !important;
  }

  .home-contact-panel-inner{
    max-height:calc(100dvh - 20px) !important;
    padding:24px 18px 18px !important;
  }

  .home-contact-panel h3{
    font-size:1.4rem !important;
    margin-bottom:14px !important;
  }

  .home-contact-field{
    gap:6px !important;
  }

  .home-contact-form{
    gap:14px !important;
  }

  .home-contact-field textarea{
    min-height:90px !important;
  }

  .home-contact-submit{
    margin-top:4px !important;
  }
}
/* =========================
   CONTACTE · CAPES DEFINITIVES
   modal per damunt de tot
   footer sempre al darrere
   ========================= */

.home-contact-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:9999999 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:20px !important;
}

.home-contact-overlay{
  position:fixed !important;
  inset:0 !important;
  z-index:1 !important;
  background:rgba(20,30,40,0.34) !important;
  backdrop-filter:blur(10px) !important;
  -webkit-backdrop-filter:blur(10px) !important;
}

.home-contact-panel{
  position:relative !important;
  z-index:2 !important;
}

/* assegurar que cap bloc de la home ni el footer superin el modal */
.footer-premium,
footer,
.site-footer,
.home-contact-cta-wrap{
  position:relative;
  z-index:auto !important;
}
/* CONTACTE sempre per damunt del menú */
.home-contact-modal{
  z-index:99999999 !important;
}

.mm-premium-menu,
.mm-premium-panel{
  z-index:9999990 !important;
}
/* =========================
   MILLENNIALS PRO · PÀGINA 29
   ========================= */

.page-id-29,
.page-id-29 .site,
.page-id-29 .site-content,
.page-id-29 .ast-container,
.page-id-29 #primary,
.page-id-29 .site-main,
.page-id-29 .entry-content,
.page-id-29 main,
.page-id-29 .top-home,
.page-id-29 .destacats,
.page-id-29 .top-social,
.page-id-29 .site-header,
.page-id-29 #masthead,
.page-id-29 .main-header-bar,
.page-id-29 .ast-builder-grid-row-container,
.page-id-29 .ast-builder-row,
.page-id-29 .site-primary-header-wrap,
.page-id-29 .ast-primary-header-bar{
  background:#223545 !important;
  background-image:none !important;
  border:none !important;
  box-shadow:none !important;
}

/* treure qualsevol línia antiga del header */
.page-id-29 #masthead,
.page-id-29 .site-header,
.page-id-29 .main-header-bar,
.page-id-29 .top-social,
.page-id-29 .top-home{
  border-top:none !important;
  box-shadow:none !important;
}

/* logo més petit només a la 29 */
.page-id-29 a.logo img{
  max-width:260px !important;
  width:100%;
  height:auto;
  padding:10px 0 !important;
}

/* treure la línia antiga del logo */
.page-id-29 a.logo{
  border-bottom:none !important;
  padding:10px 0 18px !important;
  position:relative;
}

/* línia premium vermella sota el logo */
.page-id-29 a.logo::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  height:2px;
  opacity:.55;
  background:linear-gradient(
    90deg,
    rgba(227,101,120,0) 0%,
    rgba(227,101,120,.82) 50%,
    rgba(227,101,120,0) 100%
  );
}

/* claim més petit */
.page-id-29 .top-home .container{
  max-width:900px !important;
}

.page-id-29 .top-home p{
  font-size:20px !important;
  line-height:1.6 !important;
  max-width:760px !important;
  margin:0 auto !important;
  padding:26px 0 30px !important;
}

/* si hi ha un h2 a la capçalera */
.page-id-29 .top-home h2{
  margin-bottom:6px !important;
}
.page-id-29 .destacats{
padding-top:0 !important;
margin-top:-70px !important;
}
.page-id-29 .top-home p{
margin-top:18px !important;
}

/* =========================
   FRANJA SUPERIOR VERMELLA PRO
   ========================= */

.page-id-29 .top-social{
background:#e26578 !important;
height:28px !important;
min-height:28px !important;
padding:0 !important;
}
/* =========================
   FRANJA SUPERIOR VERMELLA PRO
   ========================= */

.page-id-29 .top-social{
background:#e26578 !important;
height:28px !important;
min-height:28px !important;
padding:0 !important;
}
/* =========================
HEADER UNIFICAT PROJECTES I PRO
========================= */

.page-id-129 .top-home,
.page-id-29 .top-home{
max-width:1100px;
margin:0 auto;
text-align:center;
}

/* mateixa mida de logo */

.page-id-129 a.logo img,
.page-id-29 a.logo img{
max-width:260px !important;
height:auto;
}

/* mateix espai vertical */

.page-id-129 a.logo,
.page-id-29 a.logo{
padding:18px 0 18px !important;
}

/* mateixa alçada visual del header */

.page-id-129 .top-home,
.page-id-29 .top-home{
padding-top:40px;
}
/* =========================
HEADER IDÈNTIC PROJECTES I PRO
========================= */

.page-id-129 .top-home,
.page-id-29 .top-home{
  max-width:none !important;
  width:100% !important;
  margin:0 !important;
  padding-top:40px !important;
  text-align:center;
}

.page-id-129 .top-home > .logo,
.page-id-29 .top-home > .logo{
  display:block;
  width:100%;
  max-width:1100px;
  margin:0 auto;
  padding:18px 0 18px !important;
  text-align:center;
}

.page-id-129 a.logo img,
.page-id-29 a.logo img{
  display:block;
  width:100%;
  max-width:260px !important;
  height:auto !important;
  margin:0 auto !important;
}
/* logo més gran a Pro per igualar Projectes */

.page-id-29 a.logo img{
max-width:340px !important;
height:auto;
}
.page-id-29 a.logo::after{
bottom:-20px;
}
.home .top-social{
  display:none !important;
}
/* =========================
   COOKIES PREMIUM
   ========================= */

/* amagar només el botó flotant de gestionar consentiment */
#cmplz-manage-consent{
display:none !important;
}

/* contenidor / modal */
.cmplz-cookiebanner{
  background:
    linear-gradient(145deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.88) !important;
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);

  border:1px solid rgba(243,176,63,0.35) !important;
  border-radius:32px !important;

  box-shadow:
    0 24px 70px rgba(0,0,0,0.35),
    0 0 18px rgba(243,176,63,0.10),
    inset 0 1px 0 rgba(255,255,255,0.10) !important;

  color:#ffffff !important;
  overflow:hidden !important;
}

/* títol */
.cmplz-cookiebanner .cmplz-title{
  color:#ffffff !important;
  font-family:"Arial Rounded MT", sans-serif !important;
  font-size:2rem !important;
  line-height:1.1 !important;
  text-align:center !important;
  margin-bottom:22px !important;
}

/* text */
.cmplz-cookiebanner .cmplz-message,
.cmplz-cookiebanner .cmplz-message p{
  color:rgba(255,255,255,0.82) !important;
  font-family:"Varela Round", sans-serif !important;
  font-size:1rem !important;
  line-height:1.7 !important;
}

/* botons base */
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn{
  min-height:54px !important;
  padding:0 26px !important;
  border-radius:24px !important;
  border:1px solid rgba(255,255,255,0.16) !important;

  background:
    linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02)),
    rgba(255,255,255,0.04) !important;

  color:#ffffff !important;
  font-family:"Arial Rounded MT", sans-serif !important;
  font-size:1rem !important;
  letter-spacing:.01em !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.10),
    0 8px 20px rgba(0,0,0,0.10) !important;

  transition:
    border-color .25s ease,
    background .25s ease,
    transform .25s ease,
    box-shadow .25s ease !important;
}

/* hover general */
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(243,176,63,0.45) !important;
  box-shadow:
    0 10px 24px rgba(0,0,0,0.16),
    0 0 10px rgba(243,176,63,0.10) !important;
}

/* accepta */
.cmplz-cookiebanner .cmplz-btn.cmplz-accept{
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.02)),
    #6ea89c !important;
  border-color:rgba(255,255,255,0.12) !important;
  color:#ffffff !important;
}

/* denega i preferències */
.cmplz-cookiebanner .cmplz-btn.cmplz-deny,
.cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences{
  background:
    linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02)),
    rgba(255,255,255,0.04) !important;
  color:#ffffff !important;
}

/* enllaços inferiors */
.cmplz-cookiebanner a,
.cmplz-cookiebanner .cmplz-links a{
  color:#f3b03f !important;
  text-decoration:none !important;
  transition:opacity .25s ease !important;
}

.cmplz-cookiebanner a:hover,
.cmplz-cookiebanner .cmplz-links a:hover{
  opacity:.8 !important;
}

/* botó tancar refinat */
.cmplz-close,
button.cmplz-close{
  width:32px !important;
  height:32px !important;
  min-width:32px !important;
  min-height:32px !important;
  padding:0 !important;

  border-radius:50% !important;
  border:1px solid rgba(255,255,255,0.15) !important;
  background:rgba(255,255,255,0.05) !important;

  color:#ffffff !important;
  font-size:16px !important;
  line-height:1 !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  box-shadow:none !important;

  transition:
    border-color .25s ease,
    background .25s ease,
    transform .25s ease,
    box-shadow .25s ease !important;
}

.cmplz-close:hover,
button.cmplz-close:hover{
  border-color:#f3b03f !important;
  background:rgba(255,255,255,0.08) !important;
  transform:scale(1.05) !important;
  box-shadow:0 0 8px rgba(243,176,63,0.18) !important;
}

/* si surt la icona en svg o pseudo-element */
.cmplz-close svg,
.cmplz-close:before,
button.cmplz-close svg,
button.cmplz-close:before{
  width:14px !important;
  height:14px !important;
  font-size:14px !important;
}

/* responsive */
@media (max-width: 768px){
  .cmplz-cookiebanner{
    border-radius:26px !important;
    padding:18px !important;
  }

  .cmplz-cookiebanner .cmplz-title{
    font-size:1.55rem !important;
    margin-bottom:16px !important;
  }

  .cmplz-cookiebanner .cmplz-message,
  .cmplz-cookiebanner .cmplz-message p{
    font-size:.95rem !important;
    line-height:1.6 !important;
  }

  .cmplz-cookiebanner .cmplz-buttons{
    gap:10px !important;
  }

  .cmplz-cookiebanner .cmplz-buttons .cmplz-btn{
    width:100% !important;
    min-height:48px !important;
    font-size:.95rem !important;
  }
}

/* COOKIES PREMIUM MÉS COMPACTE */

.cmplz-cookiebanner{
  max-width: 520px !important;
  width: calc(100% - 32px) !important;
  padding:20px 22px 16px !important;
  border-radius: 28px !important;
}

.cmplz-cookiebanner .cmplz-title{
  font-size: 19px !important;
  line-height: 1.2 !important;
  margin-bottom: 16px !important;
}

.cmplz-cookiebanner .cmplz-message,
.cmplz-cookiebanner .cmplz-description{
  font-size:14px !important;
line-height:1.55 !important;
  max-width: 100% !important;
}

.cmplz-cookiebanner .cmplz-buttons{
  gap: 10px !important;
  margin-top: 14px !important;
}

.cmplz-cookiebanner .cmplz-btn{
  min-height: 46px !important;
  padding: 0 20px !important;
  font-size: 14px !important;
}

.cmplz-cookiebanner .cmplz-links{
  margin-top: 14px !important;
  gap: 12px !important;
}

.cmplz-cookiebanner .cmplz-links a{
  font-size: 13px !important;
}

.cmplz-close,
button.cmplz-close{
  width: 36px !important;
  height: 36px !important;
  top: 14px !important;
  right: 14px !important;
}

/* =========================
   SUBTÍTOL HERO · VERSIÓ NETA
   ========================= */

.hero-rotating-subtitle{
  position: relative;
  width: 100%;
  max-width: 760px;
  margin-top: 14px;
  opacity: 0;
  transform: translateY(12px);
  animation: heroSubtitleDelay .9s ease forwards;
  animation-delay: .9s;
}

.hero-rotating-line{
  position: relative;
  display: block;
  color: #f3b03f;
  font-size: clamp(1rem, 1.2vw, 1.2rem);
  line-height: 1.35;
  font-weight: 400;
  max-width: none;
  white-space: nowrap;
  text-align: left;
}

.mobile-break{
  display: none;
}

@keyframes heroSubtitleDelay{
  0%{
    opacity: 0;
    transform: translateY(14px);
  }
  100%{
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width:768px){
  .hero-rotating-subtitle{
    max-width: 320px;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
  }

  .hero-rotating-line{
    font-size: 1.02rem;
    line-height: 1.35;
    text-align: center;
    white-space: normal;
  }

  .mobile-break{
    display: block;
  }
}
/* =========================
   COOKIES BANNER PREMIUM COMPACTE
   ========================= */

.cmplz-cookiebanner{
max-width:500px !important;
width:calc(100% - 40px) !important;
padding:20px 22px 16px !important;
border-radius:24px !important;
}

/* títol */
.cmplz-cookiebanner .cmplz-title{
font-size:17px !important;
font-weight:500 !important;
line-height:1.25 !important;
margin-bottom:10px !important;
}

/* text */
.cmplz-cookiebanner .cmplz-message,
.cmplz-cookiebanner .cmplz-description{
font-size:13.5px !important;
line-height:1.55 !important;
max-width:100% !important;
}

/* botons */
.cmplz-cookiebanner .cmplz-buttons{
gap:10px !important;
margin-top:14px !important;
}

.cmplz-cookiebanner .cmplz-btn{
min-height:40px !important;
padding:0 16px !important;
font-size:13.5px !important;
border-radius:20px !important;
}

/* links legals */
.cmplz-cookiebanner .cmplz-links{
margin-top:10px !important;
gap:10px !important;
}

.cmplz-cookiebanner .cmplz-links a{
font-size:12.5px !important;
opacity:0.9;
}

/* botó tancar */
.cmplz-close,
button.cmplz-close{
width:28px !important;
height:28px !important;
top:10px !important;
right:10px !important;
border-radius:50% !important;
}
/* transició suau entre hero i primer bloc */
.top-home{
position:relative;
overflow:hidden;
}

.top-home::after{
content:"";
position:absolute;
left:0;
right:0;
bottom:0;
height:90px; /* molt més baix */
pointer-events:none;
z-index:1;
background:linear-gradient(
to bottom,
rgba(34,53,69,0) 0%,
rgba(34,53,69,0.35) 70%,
#223545 100%
);
}

.top-home::after{
  display:none !important;
  content:none !important;
}
.scroll-hint{
position:absolute;
left:50%;
bottom:34px;
transform:translateX(-50%);
width:2px;
height:42px;
background:rgba(255,255,255,0.14);
border-radius:999px;
overflow:hidden;
z-index:6;
pointer-events:none;
}

.scroll-hint span{
display:block;
width:100%;
height:18px;
border-radius:999px;
background:#f3b03f;
animation:scrollHint 1.8s ease-in-out infinite;
}

@keyframes scrollHint{
0%{
transform:translateY(-22px);
opacity:0;
}
25%{
opacity:1;
}
100%{
transform:translateY(42px);
opacity:0;
}
}

@media (max-width:768px){
  .scroll-hint{
    bottom:22px;
    height:34px;
  }

  .scroll-hint span{
    height:14px;
  }
}
/* micro moviment logo hero */

.hero-logo img{
animation: heroFloat 6s ease-in-out infinite;
}

@keyframes heroFloat{
0%{
transform: translateY(0px);
}
50%{
transform: translateY(-6px);
}
100%{
transform: translateY(0px);
}
}
/* =========================
   HOME HERO MÒBIL · BLOC NET
   ========================= */
@media (max-width: 768px){

  /* estructura general */
  .home-hero{
    position: relative !important;
    overflow: hidden !important;
    min-height: 100svh;
    width: 100vw !important;
    margin: 0 !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 0 !important;
    border-radius: 0 !important;
  }

  /* treure espais superiors heretats */
  .home,
  .home .site-content,
  .home #primary,
  .home .entry-content,
  .home .entry-content > .elementor,
  .home .entry-content > .elementor > .elementor-section:first-child,
  .home .entry-content > .elementor > .elementor-section:first-child > .elementor-container,
  .home-hero,
  .home-hero .elementor-container,
  .home-hero .elementor-column,
  .home-hero .elementor-widget-wrap,
  .home-hero .elementor-background-overlay{
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* contenidors interns sense padding lateral */
  .home-hero-inner,
  .home-hero-container{
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* imatge hero */
  .home-hero-media{
    position: absolute !important;
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    aspect-ratio: auto !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
  }

  .home-hero-media img,
  .home-hero-media video{
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  /* overlay */
  .home-hero-overlay{
    position: absolute !important;
    inset: 0 !important;
    margin: 0 !important;
    background: linear-gradient(
      to bottom,
      rgba(34,53,69,0.72) 0%,
      rgba(34,53,69,0.42) 24%,
      rgba(34,53,69,0.30) 42%,
      rgba(34,53,69,0.56) 68%,
      rgba(34,53,69,0.88) 84%,
      rgba(34,53,69,1) 100%
    );
  }

  /* logo */
  .hero-logo{
    top: 110px !important;
    width: 150px !important;
  }

  /* contingut central */
  .home-hero-content{
    left: 50% !important;
    bottom: 150px !important;
    transform: translateX(-50%) !important;
    width: calc(100% - 36px) !important;
    max-width: 320px !important;
    text-align: center !important;
  }

  .home-hero-content h1{
    font-size: 1.8rem !important;
    line-height: 1.15 !important;
    margin: 0 0 14px 0 !important;
    max-width: none !important;
  }

  .home-hero-content h5,
  .home-hero-content p{
    font-size: 0.95rem !important;
    line-height: 1.35 !important;
    max-width: 280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

 /* ======================================================
   SCROLL HINT HERO · MÒBIL
   Apareix bastant després del subtítol
   ====================================================== */

@media (max-width:768px){

  .scroll-hint{
    bottom:60px !important;
    height:40px !important;
    width:2px !important;

    opacity:0;
    transform:translateY(8px);
    animation:scrollReveal .6s ease forwards;
    animation-delay:3.8s;   /* 2 segons més tard */
  }

  .scroll-hint span{
    height:12px !important;
    opacity:.75;
  }

}

@keyframes scrollReveal{
  from{
    opacity:0;
    transform:translateY(10px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}
@keyframes scrollReveal{
  from{
    opacity:0;
    transform:translateY(10px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

  /* botons superiors: mantenir fixed perquè funcionin bé en scroll */
  .hero-contact{
    position: fixed !important;
    top: 20px !important;
    left: 16px !important;
    z-index: 999999 !important;
  }

  .mm-premium-menu{
    position: fixed !important;
    top: 20px !important;
    right: 16px !important;
    z-index: 999999 !important;
  }

  .hero-contact .home-contact-trigger,
  .mm-premium-trigger{
    transform: none !important;
    height: 40px !important;
    min-width: 98px !important;
    padding: 0 16px !important;
  }

  .hero-contact .home-contact-trigger span,
  .mm-premium-trigger span{
    font-size: 10px !important;
    letter-spacing: .12em !important;
  }

  /* franja logos clients */
  .clients-marquee{
    padding: 0 0 8px !important;
  }

  .clients-marquee-inner{
    gap: 34px !important;
  }

  .clients-marquee img{
    height: 20px !important;
    opacity: .72 !important;
  }
}
/* =========================
   COMPENSAR BARRA ADMIN WP EN MÒBIL
   ========================= */
@media (max-width: 768px){

  body.admin-bar .hero-contact{
    top: 66px !important;
  }

  body.admin-bar .mm-premium-menu{
    top: 66px !important;
  }

}
/* treure top bar a la home en mòbil */
@media (max-width:768px){

  .home .top-social{
    display:none !important;
  }

}
/* =========================
   NETEJA SUPERIOR HOME MÒBIL
   ========================= */
@media (max-width: 768px){

  /* treure qualsevol aire del contenidor superior */
  .home .top-home{
    padding-top: 0 !important;
    margin-top: 0 !important;
    position: relative !important;
  }

  /* el header no ha de reservar espai visual */
  .home .site-header,
  .home #masthead,
  .home .main-header-bar,
  .home .site-primary-header-wrap,
  .home .ast-builder-grid-row-container,
  .home .ast-builder-row{
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
  }

  /* assegurar que el hero arrenca dalt de tot */
  .home .top-home > .home-hero{
    margin-top: 0 !important;
  }
}
/* ======================================================
   AJUST LOGOTIP HERO EN MÒBIL
   ------------------------------------------------------
   El claim "social media en turisme" quedava massa petit.
   Augmentem la mida del logotip en mòbil perquè la marca
   i el missatge es llegeixin clarament al hero.
   ====================================================== */

@media (max-width:768px){

  .hero-logo{
    width:200px !important;   /* mida més llegible en mòbil */
    top:125px !important;     /* mantenim bona distància amb CONTACTE i MENU */
  }

}
/* ======================================================
   BOTONS HERO MÒBIL MÉS DISCRETS
   ------------------------------------------------------
   Reduïm lleugerament la mida visual dels botons CONTACTE
   i MENU perquè no competeixin amb el logo i el titular,
   mantenint una zona clicable acceptable en mòbil.
   ====================================================== */

@media (max-width:768px){

  .mm-premium-trigger,
  .hero-contact .home-contact-trigger{
    height:32px !important;
    min-width:82px !important;
    padding:0 12px !important;
    border-radius:24px !important;
  }

  .mm-premium-trigger span,
  .hero-contact .home-contact-trigger span{
    font-size:9.5px !important;
    letter-spacing:.12em !important;
  }

}
/* ======================================================
   AJUST TITULAR HERO EN MÒBIL
   ------------------------------------------------------
   Reduïm lleugerament la mida del titular perquè el
   logotip mantingui el protagonisme al hero i millori
   l'equilibri visual en pantalles petites.
   ====================================================== */

@media (max-width:768px){

  .home-hero-content h1{
    font-size:1.7rem !important;   /* abans ~1.8rem */
    line-height:1.14 !important;
  }

}
/* petit ajust de respiració entre logo i titular */

@media (max-width:768px){

  .home-hero-content{
    bottom:140px !important;
  }

}
/* ======================================================
   TRANSICIÓ HERO → CLIENTS EN MÒBIL
   ------------------------------------------------------
   Fem que la franja de logos després del hero sigui més
   compacta, elegant i coherent amb una estètica premium.
   Els logos validen autoritat però no han de competir amb
   el hero principal.
   ====================================================== */

@media (max-width:768px){

  .clients-marquee{
    padding:10px 0 6px !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
    overflow:hidden !important;
  }

  .clients-marquee-inner{
    gap:26px !important;
    align-items:center !important;
  }

  .clients-marquee img{
    height:22px !important;
    width:auto !important;
    opacity:.72 !important;
  }

}
/* ======================================================
   FRANJA DE LOGOS DESPRÉS DEL HERO EN MÒBIL
   ------------------------------------------------------
   Compactem la transició entre el hero i la franja de
   clients. Fem els logos una mica més visibles però amb
   un aire discret i elegant.
   ====================================================== */

@media (max-width:768px){

  .clients-marquee{
    padding:8px 0 4px !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
    overflow:hidden !important;
  }

  .clients-marquee-inner{
    gap:28px !important;
    align-items:center !important;
  }

  .clients-marquee img{
    height:24px !important;
    width:auto !important;
    opacity:.76 !important;
  }

}
/* ======================================================
   RESPIRACIÓ ENTRE HERO I LOGOS (MÒBIL)
   ------------------------------------------------------
   Afegim una mica d'espai perquè la transició visual
   entre el hero i els logos sigui més elegant.
   ====================================================== */

@media (max-width:768px){

  .clients-marquee{
    margin-top:14px !important;
  }

}
@media (max-width:768px){

  .clients-marquee img{
    opacity:.68 !important;
  }

}
/* ======================================================
   TEXT SECCIÓ VALORS EN MÒBIL
   ====================================================== */

@media (max-width:768px){

  .destacats p{
    line-height:1.6 !important;
    max-width:320px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

}
/* ======================================================
   ICONES XARXES EN MÒBIL
   ------------------------------------------------------
   Ens assegurem que les icones socials siguin visibles
   en pantalles petites i quedin centrades sota els logos
   dels clients.
   ====================================================== */

@media (max-width:768px){

  .hero-social{
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    gap:18px !important;
    margin-top:14px !important;
    margin-bottom:8px !important;
  }

  .hero-social a{
    opacity:.75;
    transition:opacity .2s ease;
  }

  .hero-social a:hover{
    opacity:1;
  }

  .hero-social svg,
  .hero-social i{
    width:18px;
    height:18px;
  }

}
/* ======================================================
   XARXES SOCIALS VISIBLES EN MÒBIL
   ------------------------------------------------------
   Recuperem les icones socials sota la franja de logos.
   ====================================================== */

@media (max-width:768px){

  .home .hero-social{
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    gap:18px !important;
    margin:18px 0 10px !important;
    padding:0 !important;
    height:auto !important;
    min-height:auto !important;
    opacity:.78 !important;
  }

  .home .hero-social a{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    opacity:.78 !important;
    transition:opacity .25s ease, transform .25s ease;
  }

  .home .hero-social a:hover{
    opacity:1 !important;
    transform:translateY(-1px);
  }

  .home .hero-social img,
  .home .hero-social svg,
  .home .hero-social i{
    width:16px !important;
    height:16px !important;
    display:block !important;
  }

}
/* ======================================================
   ICONES SOCIALS I TRANSICIÓ HERO → LOGOS (MÒBIL)
   ------------------------------------------------------
   Fem les icones socials més discretes i ajustem la
   respiració entre el hero, la franja de logos dels
   clients i les xarxes socials perquè la composició
   sigui més equilibrada en pantalles petites.
   ====================================================== */

@media (max-width:768px){

  /* espai al bloc de logos de clients */
  .clients-marquee{
    margin-top:24px !important;
    margin-bottom:20px !important;
  }

  /* posició i presència de les icones socials */
  .home .hero-social{
    margin-top:8px !important;
    margin-bottom:22px !important;
    gap:22px !important;
    opacity:.65 !important;
  }

  /* mida de les icones */
  .home .hero-social img,
  .home .hero-social svg,
  .home .hero-social i{
    width:14px !important;
    height:14px !important;
  }

}
/* ======================================================
   AJUST POSICIÓ ICONES SOCIALS (MÒBIL)
   ====================================================== */

@media (max-width:768px){

  .home .hero-social{
    margin-top:110px !important;
    margin-bottom:50px !important;
    gap:22px !important;
    opacity:.65 !important;
  }

  .home .hero-social img,
  .home .hero-social svg,
  .home .hero-social i{
    width:14px !important;
    height:14px !important;
  }

}
/* ======================================================
   SECCIÓ VALORS EN MÒBIL · REFINAMENT PREMIUM
   ------------------------------------------------------
   En mòbil compactem la secció Excel·lència / Experiència
   / Criteri perquè no quedi massa gran ni massa apilada.
   Busquem una lectura més editorial i propera a la
   jerarquia del desktop.
   ====================================================== */

@media (max-width:768px){

  .values-premium{
    padding:40px 0 50px !important;
  }

  .values-premium-row{
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding:26px 0 !important;
  }

  .values-premium-row::before{
    top:-10px !important;
    width:26px !important;
    height:5px !important;
  }

  .values-premium-title{
    font-size:1.7rem !important;
    line-height:1.08 !important;
    text-align:center !important;
    margin:0 0 4px 0 !important;
  }

  .values-premium-text{
    font-size:1.02rem !important;
    line-height:1.55 !important;
    max-width:320px !important;
    margin:0 auto !important;
    text-align:left !important;
  }

}
/* ======================================================
   SECCIÓ VALORS EN MÒBIL · VERSIÓ RADICAL / EDITORIAL
   ------------------------------------------------------
   En mòbil deixem de replicar l'estructura gran del desktop
   i convertim Excel·lència / Experiència / Criteri en tres
   peces compactes i editorials.
   Objectiu:
   menys verticalitat
   més refinament
   més lectura premium
   ====================================================== */

@media (max-width:768px){

  /* bloc general més compacte */
  .values-premium{
    padding:40px 0 34px !important;
    max-width:100% !important;
  }

  /* cada peça funciona com un bloc editorial compacte */
  .values-premium-row{
    display:block !important;
    padding:32px 0 24px !important;
    margin:0 auto !important;
    max-width:340px !important;
    border-bottom:1px solid rgba(255,255,255,0.06) !important;
  }

  /* el primer bloc respira una mica menys per enganxar millor amb la secció anterior */
  .values-premium-row:first-child{
    padding-top:24px !important;
  }

  /* eliminem la pastilla/separador central antiga */
  .values-premium-row::before{
    display:none !important;
  }

  /* títol més petit i editorial */
  .values-premium-title{
    display:block !important;
    font-size:1.15rem !important;
    line-height:1.15 !important;
    letter-spacing:.02em !important;
    text-align:left !important;
    margin:0 0 10px 0 !important;
    color:#9fc9c1 !important;
  }

  /* text compacte i molt llegible */
  .values-premium-text{
    max-width:none !important;
    margin:0 !important;
    font-size:1.02rem !important;
    line-height:1.65 !important;
    text-align:left !important;
    color:rgba(255,255,255,0.90) !important;
  }

  /* paraules destacades */
  .values-premium-text strong{
    color:#f3b03f !important;
    font-weight:normal !important;
  }

}
@media (max-width:768px){

/* ======================================================
   BLOC "QUÈ ENS MOU..." EN MÒBIL
   ====================================================== */
@media (max-width:768px){

  .motiva{
    margin-top:34px !important;
    max-width:340px !important;
    text-align:center !important;
    font-size:1.9rem !important;
    line-height:1.15 !important;
    color:#f3b03f !important;
    white-space:normal !important;
  }

  .motiva img,
  .millennials .title .millennials img{
    max-width:260px !important;
    width:100% !important;
    height:auto !important;
    margin:18px auto 0 !important;
    display:block !important;
  }

  /* BOTONS HERO NOMÉS VISIBLES DINS DEL HERO */
  .hero-contact,
  .mm-premium-menu{
    transition:opacity .28s ease, transform .28s ease;
  }

  body.hero-ui-hidden .hero-contact,
  body.hero-ui-hidden .mm-premium-menu{
    opacity:0 !important;
    pointer-events:none !important;
    transform:translateY(-8px);
  }

  /* TARGETES SERVEIS · VERSIÓ PREMIUM MÒBIL */
  .services-premium .elementor-widget-container{
    max-width:320px !important;
    margin:28px auto !important;
  }

  .services-premium .elementor-widget-container > div{
    padding:28px 24px !important;
    border-radius:20px !important;
  }

  .services-premium h3{
    font-size:1.45rem !important;
    line-height:1.2 !important;
    text-align:center !important;
    margin-bottom:12px !important;
  }

  .services-premium p{
    font-size:.95rem !important;
    line-height:1.65 !important;
    text-align:center !important;
    max-width:260px !important;
    margin:0 auto !important;
  }

}
	/* ======================================================
   TARGETES DESTACATS · VERSIÓ MÒBIL REFINADA
   ====================================================== */

@media (max-width:768px){

  /* contenidor general */
  section.destacats{
    padding:10px 0 40px !important;
  }

  /* cada targeta */
  section.destacats .destacat{
    max-width:300px !important;
    margin:32px auto !important;
    padding:26px 22px !important;
    border-radius:22px !important;
  }

  /* línia groga superior més discreta */
  section.destacats .destacat::after{
    content:"";
    position:absolute;
    top:18px;
    left:18px;
    width:24px;
    height:5px;
    border-radius:20px;
    background:rgba(243,176,63,0.85);
    box-shadow:none;
  }

  /* amaguem la peça antiga si existeix */
  section.destacats .destacat .separador{
    display:none !important;
  }

  /* títol */
  section.destacats .destacat h3{
    font-size:1.35rem !important;
    line-height:1.2 !important;
    text-align:left !important;
    margin-bottom:12px !important;
  }

  /* text */
  section.destacats .destacat p{
    font-size:.92rem !important;
    line-height:1.6 !important;
    text-align:left !important;
    max-width:240px !important;
    margin:0 !important;
  }

  /* separació entre targetes */
  section.destacats .destacat + .destacat{
    margin-top:34px !important;
  }

}
	@media (max-width:768px){

  .values-premium{
    margin-bottom:64px !important;
  }

}
/* ======================================================
   EQUIP EN MÒBIL · MÉS COMPACTE I EN 2 COLUMNES
   ====================================================== */

@media (max-width:768px){

  /* bloc general */
  .home .equip{
    padding:48px 16px 56px !important;
  }

  /* grid: 2 persones per fila */
  .home .equip .grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:34px 22px !important;
    max-width:340px !important;
    margin:0 auto !important;
    align-items:start !important;
  }

  /* peça individual */
  .home .equip .person{
    max-width:none !important;
    margin:0 auto !important;
    text-align:center !important;
  }

  /* nom */
  .home .equip .person h4{
    font-size:1.55rem !important;
    line-height:1.1 !important;
    margin:0 0 6px 0 !important;
  }

  /* filet sota el nom */
  .home .equip .person h4::after{
    width:18px !important;
    height:3px !important;
    margin:8px auto 0 !important;
  }

  /* descripció */
  .home .equip .person p{
    font-size:.92rem !important;
    line-height:1.45 !important;
    max-width:140px !important;
    margin:0 auto !important;
    color:rgba(255,255,255,0.76) !important;
  }

  /* títol EQUIP */
  .home .millennials .title{
    font-size:1rem !important;
    letter-spacing:.10em !important;
  }

  .home .millennials .title::after{
    width:34px !important;
    margin-top:10px !important;
  }

}
	/* ======================================================
   EQUIP · TEXTOS DE ROL MÉS PREMIUM
   ====================================================== */

@media (max-width:768px){

  .equip p{
    font-size:.88rem !important;
    line-height:1.45 !important;
    font-weight:300 !important;
    color:rgba(255,255,255,0.68) !important;
    letter-spacing:.01em !important;
  }

}
/* ======================================================
   EQUIP DESPLEGABLE A MÒBIL · HOME
   ====================================================== */

@media (max-width:768px){

  /* amaguem el títol antic de la secció */
  .home .millennials{
    display:none !important;
  }

  /* contenidor del desplegable */
  .home .team-accordion-mobile{
    max-width:340px;
    margin:0 auto 20px auto;
    padding:0 16px;
  }

  /* botó */
  .home .team-accordion-toggle{
    appearance:none;
    -webkit-appearance:none;
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:0 0 14px 0;
    border:none;
    background:transparent;
    cursor:pointer;
    text-align:left;
    border-bottom:1px solid rgba(255,255,255,0.08);
  }

  /* text EQUIP */
  .home .team-accordion-label{
    color:#f3b03f;
    font-family:"Varela Round", sans-serif;
    font-size:1rem;
    letter-spacing:.12em;
    text-transform:uppercase;
    line-height:1;
  }

  /* fletxa */
  .home .team-accordion-arrow{
    color:rgba(255,255,255,0.72);
    font-size:1.1rem;
    line-height:1;
    transition:transform .28s ease, color .28s ease;
  }

  .home .team-accordion-toggle[aria-expanded="true"] .team-accordion-arrow{
    transform:rotate(180deg);
    color:#f3b03f;
  }

  /* panell tancat per defecte */
  .home .team-accordion-panel{
    max-height:0;
    overflow:hidden;
    opacity:0;
    visibility:hidden;
    transition:max-height .42s ease, opacity .28s ease, padding-top .28s ease;
    padding-top:0 !important;
  }

  /* panell obert */
  .home .equip.team-open .team-accordion-panel{
    max-height:1400px;
    opacity:1;
    visibility:visible;
    padding-top:24px !important;
  }

  /* grid en 2 columnes */
  .home .equip .team-accordion-panel.grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:34px 22px !important;
    max-width:340px !important;
    margin:0 auto !important;
    align-items:start !important;
  }

  /* peça individual */
  .home .equip .team-accordion-panel .person{
    max-width:none !important;
    margin:0 auto !important;
    text-align:center !important;
  }

  /* noms */
  .home .equip .team-accordion-panel .person h4{
    font-size:1.55rem !important;
    line-height:1.1 !important;
    margin:0 0 6px 0 !important;
    color:#ffffff !important;
  }

  /* filet sota el nom */
  .home .equip .team-accordion-panel .person h4::after{
    content:"";
    display:block;
    width:18px !important;
    height:3px !important;
    margin:8px auto 0 !important;
    border-radius:999px;
    background:#f3b03f;
    opacity:.9;
  }

  /* càrrecs més fins i més premium */
  .home .equip .team-accordion-panel .person p{
    font-size:.86rem !important;
    line-height:1.45 !important;
    font-weight:300 !important;
    color:rgba(255,255,255,0.66) !important;
    max-width:140px !important;
    margin:0 auto !important;
    letter-spacing:.01em !important;
  }

}

/* ======================================================
   EQUIP DESPLEGABLE · NOMÉS MÒBIL
   En desktop no ha d'aparèixer cap botó ni accordion
   ====================================================== */

@media (min-width:769px){

  .home .team-accordion-mobile{
    display:none !important;
  }

  .home .team-accordion-panel{
    display:grid !important;
    max-height:none !important;
    opacity:1 !important;
    visibility:visible !important;
    overflow:visible !important;
    padding-top:0 !important;
  }

}
	/* ======================================================
   EQUIP ACCORDION · CONTROL VISIBILITAT
   Per defecte no es veu. Només apareix en mòbil.
   ====================================================== */

/* per defecte: amagat a tot arreu */
.home .team-accordion-mobile{
  display:none !important;
}

/* desktop: el grid sempre visible */
@media (min-width:769px){

  .home .team-accordion-mobile{
    display:none !important;
  }

  .home .team-accordion-panel{
    display:grid !important;
    max-height:none !important;
    opacity:1 !important;
    visibility:visible !important;
    overflow:visible !important;
    padding-top:0 !important;
  }

}

/* ======================================================
   EQUIP · ACCORDION MÒBIL
   ====================================================== */

/* mòbil: aquí sí que apareix el desplegable */
@media (max-width:768px){

  .home .team-accordion-mobile{
    display:block !important;
  }

  /* panell tancat */
  .home .team-accordion-panel{
    max-height:0;
    overflow:hidden;
    opacity:0;
    visibility:hidden;
    transition:max-height .5s cubic-bezier(.4,0,.2,1), opacity .35s ease;
  }

  /* panell obert */
  .home .equip.team-open .team-accordion-panel{
    max-height:1400px;
    opacity:1;
    visibility:visible;
  }

  /* animació suau dels membres */
  .home .team-accordion-panel .person{
    opacity:0;
    transform:translateY(10px);
    transition:opacity .35s ease, transform .35s ease;
  }

  .home .equip.team-open .team-accordion-panel .person{
    opacity:1;
    transform:none;
  }

  /* animació de la fletxa */
  .home .team-accordion-arrow{
    transition:transform .25s ease;
  }

  .home .equip.team-open .team-accordion-arrow{
    transform:rotate(180deg);
  }

}


/* ======================================================
   DESKTOP · L'EQUIP SEMPRE VISIBLE
   ====================================================== */

@media (min-width:769px){

  .home .equip{
    position:relative;
  }

  /* botó ocult en escriptori */
  .home .equip .team-accordion-mobile,
  .home .equip .team-accordion-toggle{
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
  }

  /* el grid sempre visible */
  .home .team-accordion-panel{
    max-height:none !important;
    opacity:1 !important;
    visibility:visible !important;
    overflow:visible !important;
  }

}
	/* ======================================================
   EQUIP ACCORDION · CAPÇALERA CENTRADA EN MÒBIL
   ====================================================== */

@media (max-width:768px){

  .home .team-accordion-mobile{
    max-width:340px !important;
    margin:0 auto 18px !important;
    padding:0 !important;
  }

  .home .team-accordion-toggle{
    width:100% !important;
    display:grid !important;
    grid-template-columns:1fr auto 1fr !important;
    align-items:center !important;
    padding:0 0 12px 0 !important;
    border:none !important;
    border-bottom:1px solid rgba(255,255,255,0.08) !important;
    background:transparent !important;
  }

  .home .team-accordion-label{
    grid-column:2 !important;
    justify-self:center !important;
    text-align:center !important;
    color:#f3b03f !important;
    font-family:"Varela Round", sans-serif !important;
    font-size:1rem !important;
    letter-spacing:.12em !important;
    text-transform:uppercase !important;
    line-height:1 !important;
  }

  .home .team-accordion-arrow{
    grid-column:3 !important;
    justify-self:end !important;
    color:rgba(255,255,255,0.72) !important;
    font-size:1rem !important;
    line-height:1 !important;
    transition:transform .25s ease, color .25s ease !important;
  }

  .home .equip.team-open .team-accordion-arrow{
    transform:rotate(180deg) !important;
    color:#f3b03f !important;
  }

}
	@media (max-width:768px){

  .home .team-accordion-toggle{
    width:100% !important;
    max-width:260px !important;   /* amplada real de la línia */
    margin:0 auto !important;     /* centrar */
    display:grid !important;
    grid-template-columns:1fr auto 1fr !important;
    align-items:center !important;
    padding:0 0 12px 0 !important;
    border:none !important;
    border-bottom:1px solid rgba(255,255,255,0.08) !important;
    background:transparent !important;
  }

}
	@media (max-width:768px){

  .home .team-accordion-toggle{
    max-width:200px !important;  /* línia més curta */
  }

}
@media (max-width:768px){

  .home .support .container{
    text-align:center !important;
  }

  .home .support .container ul{
    padding:0;
    margin:20px auto 0 auto;
    list-style:none;
    text-align:center;
  }

  .home .support .container li{
    margin:10px 0;
  }

}
	@media (max-width:768px){

  .footer-premium .footer-right{
    width:100% !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
  }

  .footer-premium .footer-right a{
    display:block !important;
    width:auto !important;
    text-align:center !important;
    margin:0 auto !important;
    padding:0 !important;
  }

}
/* ======================================================
   FOOTER · ESPAI ENTRE BLOCS (MÒBIL)
   ====================================================== */

@media (max-width:768px){

  /* espai sota les icones */
  .footer-premium .footer-social{
    margin-bottom:34px !important;
  }

  /* espai sota l'adreça */
  .footer-premium .footer-address{
    margin-bottom:36px !important;
  }

}
	/* =====================================
   DESACTIVAR CURSOR + LLUM A LA HOME MÒBIL
   ===================================== */

@media (max-width:768px){

  .home .cursor,
  .home .cursor-glow,
  .home .mm-cursor,
  .home .mm-cursor-glow,
  .home .cursor-light,
  .home .cursor-light-glow{
    display:none !important;
    opacity:0 !important;
    pointer-events:none !important;
  }

}
	/* =====================================
   TREURE LLUM CENTRAL A LA HOME MÒBIL
   ===================================== */

@media (max-width:768px){

  .home .cursor-light,
  .home .cursor-glow,
  .home .mm-cursor-glow,
  .home .cursor-bg,
  .home .mouse-light{
    display:none !important;
    opacity:0 !important;
    visibility:hidden !important;
  }

}
	@media (max-width:768px){

  .home div[style*="radial-gradient"]{
    display:none !important;
  }

}
	/* ======================================================
   DESACTIVAR CURSOR M + LLUM A LA HOME EN MÒBIL
   ====================================================== */

@media (max-width:768px){

  .home .cursor-light-home{
    display:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    background:none !important;
  }

  .home .cursor-m{
    display:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    background-image:none !important;
  }

  body.home.cursor-m-active,
  body.home.cursor-m-active *{
    cursor:auto !important;
  }

}
	/* ======================================================
   MENU MÒBIL HOME — ESCALA MÉS PETITA
   ====================================================== */

@media (max-width:768px){

  /* items principals */
  .mm-premium-menu a,
  .mm-premium-menu .menu-item > a{
    font-size:22px !important;
    line-height:1.3 !important;
    padding:12px 0 !important;
  }

  /* fletxes desplegables */
  .mm-premium-menu .submenu-toggle{
    transform:scale(.8);
  }

  /* submenus */
  .mm-premium-menu .sub-menu a{
    font-size:18px !important;
    padding:8px 0 !important;
  }

  /* espai entre blocs */
  .mm-premium-menu .menu-item{
    margin-bottom:6px;
  }

  /* línies separadores finals */
  .mm-premium-menu .menu-footer{
    margin-top:24px;
  }

}
	/* =====================================
   MENU OVERLAY — TEXT MÉS PETIT MÒBIL
   (sense tocar layout)
   ===================================== */

@media (max-width:768px){

  .mm-premium-menu a{
    font-size:20px !important;
  }

  .mm-premium-menu-footer a{
    font-size:18px !important;
  }

  .mm-premium-menu-social a{
    font-size:16px !important;
  }

}
	/* ======================================================
   MENÚ OVERLAY HOME MÒBIL · MÉS PETIT SENSE MOURE'L
   ====================================================== */

@media (max-width:768px){

  .mm-premium-panel{
    width:min(320px, 86vw) !important;
  }

  .mm-premium-panel-content{
    padding:62px 22px 22px !important;
    min-height:500px !important;
  }

  .mm-premium-nav{
    top:0 !important;
    max-width:100% !important;
  }

  .mm-menu-item{
    padding:14px 0 !important;
  }

  .mm-menu-item > a,
  .mm-menu-toggle{
    font-size:1.28rem !important;
    line-height:1.15 !important;
  }

  .mm-menu-desc{
    margin-top:4px !important;
  }

  .mm-menu-desc a{
    font-size:13px !important;
    line-height:1.35 !important;
    padding:8px 0 !important;
  }

  .mm-premium-bottom-links{
    max-width:100% !important;
    padding-top:14px !important;
    margin-top:6px !important;
  }

  .mm-premium-bottom-links a{
    font-size:0.95rem !important;
  }

  .mm-premium-meta{
    margin-top:12px !important;
    padding-top:14px !important;
    gap:16px !important;
    justify-content:center !important;
  }

  .mm-premium-meta a{
    font-size:12px !important;
  }

  .mm-premium-close{
    width:38px !important;
    height:38px !important;
    font-size:22px !important;
    top:14px !important;
    right:14px !important;
  }

}
	/* ======================================================
   MENÚ OVERLAY MÒBIL · ESCALA COMPACTA
   ====================================================== */

@media (max-width:768px){

  .mm-menu-item > a,
  .mm-menu-toggle{
    font-size:0.95rem !important;
    line-height:1.1 !important;
  }

  .mm-menu-item{
    padding:10px 0 !important;
  }

  .mm-premium-bottom-links a{
    font-size:0.82rem !important;
  }

  .mm-premium-meta a{
    font-size:0.72rem !important;
  }

}
	/* =================================
   MENÚ OVERLAY MÒBIL · PANELL MÉS ESTRET
   ================================= */

@media (max-width:768px){

  .mm-premium-panel{
    width:72vw !important;
    max-width:250px !important;
  }

}
/* ======================================================
   MENÚ MÒBIL · PANELL MÉS CURT DE VERITAT
   ====================================================== */

@media (max-width:768px){

  .mm-premium-panel{
    min-height:420px !important;
  }

  .mm-premium-panel-content{
    min-height:420px !important;
  }

}
	/* ======================================================
   PAGE 103 · PROJECTES · FIX MÒBIL DEFINITIU
   POSAR AL FINAL DE TOT DEL CSS
   ====================================================== */

@media (max-width:768px){

  .page-id-103 .social-cases{
    padding:40px 0 42px !important;
    background:#223545 !important;
  }

  .page-id-103 .social-cases .container{
    width:calc(100% - 28px) !important;
    max-width:none !important;
    padding:0 !important;
    margin:0 auto !important;
  }

  .page-id-103 .social-cases-intro{
    max-width:320px !important;
    margin:0 auto 24px !important;
    text-align:center !important;
  }

  .page-id-103 .social-cases-intro h2{
    font-size:2rem !important;
    line-height:1.08 !important;
    margin:0 0 10px 0 !important;
  }

  .page-id-103 .social-cases-intro p{
    font-size:.96rem !important;
    line-height:1.55 !important;
    margin:0 !important;
    color:rgba(255,255,255,0.78) !important;
  }

  /* filtres */
  .page-id-103 .projects-filters{
    justify-content:flex-start !important;
    flex-wrap:nowrap !important;
    gap:10px !important;
    margin:0 0 22px 0 !important;
    padding:0 2px 8px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scrollbar-width:none !important;
  }

  .page-id-103 .projects-filters::-webkit-scrollbar{
    display:none !important;
  }

  .page-id-103 .projects-filter{
    flex:0 0 auto !important;
    white-space:nowrap !important;
    font-size:.82rem !important;
    min-height:36px !important;
    padding:9px 16px !important;
  }

  /* llista */
  .page-id-103 .social-cases-list{
    border-top:1px solid rgba(243,176,63,0.14) !important;
  }

  .page-id-103 .social-case{
    border-bottom:1px solid rgba(243,176,63,0.14) !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  .page-id-103 .social-case:hover{
    background:transparent !important;
    box-shadow:none !important;
  }

  /* capçalera projecte tancat */
  .page-id-103 .social-case-head{
    padding:20px 0 !important;
    background:transparent !important;
  }

  .page-id-103 .social-case-grid{
    display:grid !important;
    grid-template-columns:1fr auto !important;
    gap:10px 14px !important;
    align-items:start !important;
  }

  .page-id-103 .social-case-client{
    grid-column:1 / 2 !important;
  }

  .page-id-103 .social-case-copy{
    grid-column:1 / 2 !important;
    max-width:none !important;
    font-size:.96rem !important;
    line-height:1.5 !important;
    margin:0 !important;
  }

  .page-id-103 .social-case-channels{
    grid-column:1 / 2 !important;
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:wrap !important;
    gap:8px 12px !important;
    align-items:center !important;
    margin:0 !important;
  }

  .page-id-103 .social-case-channels span{
    font-size:.82rem !important;
    line-height:1.2 !important;
    color:rgba(255,255,255,0.62) !important;
  }

  .page-id-103 .social-case-cta{
    grid-column:2 / 3 !important;
    grid-row:1 / 4 !important;
    align-items:flex-end !important;
    justify-content:flex-start !important;
    gap:0 !important;
  }

  .page-id-103 .social-case-cta-text{
    display:none !important;
  }

  .page-id-103 .social-case-plus{
    width:32px !important;
    height:32px !important;
    font-size:1rem !important;
  }

  .page-id-103 .social-case-title{
    margin-left:0 !important;
    font-size:1.35rem !important;
    line-height:1.08 !important;
    opacity:1 !important;
    text-shadow:none !important;
  }

  /* estat obert: matar layout desktop */
  .page-id-103 .social-case.is-open{
    padding:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  .page-id-103 .social-case.is-open::before{
    display:none !important;
    content:none !important;
  }

  .page-id-103 .social-case.is-open .social-case-toggle{
    position:relative !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    width:100% !important;
  }

  .page-id-103 .social-case.is-open .social-case-head{
    padding:20px 0 !important;
    background:transparent !important;
  }

  .page-id-103 .social-case.is-open .social-case-panel{
    margin-top:0 !important;
    padding:0 0 22px !important;
    max-height:2000px !important;
  }

  .page-id-103 .social-case.is-open .social-case-title{
    font-size:1.35rem !important;
    line-height:1.08 !important;
    margin-left:0 !important;
    text-shadow:none !important;
  }

  .page-id-103 .social-case.is-open .social-case-copy{
    font-size:.96rem !important;
    line-height:1.5 !important;
    max-width:none !important;
    text-shadow:none !important;
  }

  .page-id-103 .social-case.is-open .social-case-channels span{
    text-shadow:none !important;
  }

  /* visual obert en vertical */
  .page-id-103 .social-case-visuals,
  .page-id-103 .social-case.is-open .social-case-visuals{
    position:relative !important;
    min-height:auto !important;
    margin-top:14px !important;
    padding-top:0 !important;
    border-radius:18px !important;
    overflow:hidden !important;
    background:#1f3140 !important;
    box-shadow:none !important;
  }

  .page-id-103 .social-case-visuals::before,
  .page-id-103 .social-case.is-open .social-case-visuals::before{
    display:none !important;
    content:none !important;
  }

  .page-id-103 .social-case-hero,
  .page-id-103 .social-case.is-open .social-case-hero{
    position:relative !important;
    inset:auto !important;
    height:210px !important;
    border-radius:18px 18px 0 0 !important;
    overflow:hidden !important;
  }

  .page-id-103 .social-case-hero img,
  .page-id-103 .social-case.is-open .social-case-hero img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center center !important;
    border-radius:0 !important;
    transform:none !important;
    animation:none !important;
    filter:grayscale(18%) contrast(1.04) brightness(0.78) saturate(0.92) !important;
  }

  .page-id-103 .social-case-side,
  .page-id-103 .social-case.is-open .social-case-side{
    position:relative !important;
    z-index:2 !important;
    display:block !important;
    width:100% !important;
    height:auto !important;
    padding:14px 12px 14px !important;
    align-items:initial !important;
    justify-content:initial !important;
  }

  .page-id-103 .social-case-phones,
  .page-id-103 .social-case.is-open .social-case-phones{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:10px !important;
    align-items:start !important;
    opacity:1 !important;
    transform:none !important;
  }

  .page-id-103 .phone-card,
  .page-id-103 .phone-card:first-child,
  .page-id-103 .phone-card:last-child,
  .page-id-103 .phone-card-offset{
    transform:none !important;
    margin:0 !important;
  }

  .page-id-103 .phone-frame{
    width:100% !important;
    max-width:none !important;
    border-radius:18px !important;
    padding:8px !important;
  }

  .page-id-103 .phone-notch{
    width:46px !important;
    height:8px !important;
    top:6px !important;
  }

  .page-id-103 .phone-frame img,
  .page-id-103 .phone-frame video{
    width:100% !important;
    border-radius:12px !important;
  }

  .page-id-103 .social-case-extra{
    display:none !important;
  }
}
/* ======================================================
   PAGE 103 · PROJECTES · AJUST FINAL FILTRES MÒBIL
   ====================================================== */

@media (max-width:768px){

  .page-id-103 .social-cases .container{
    width:calc(100% - 60px) !important;
  }

  .page-id-103 .social-cases-intro{
    max-width:300px !important;
    margin-top:-75px !important;
  }

  .page-id-103 .top-home{
    border-bottom:none !important;
  }

  .page-id-103 .top-home::after{
    display:none !important;
  }

  .page-id-103 .social-cases-intro h1,
  .page-id-103 .social-cases-intro h2{
    font-size:1.45rem !important;
    line-height:1.12 !important;
    white-space:nowrap !important;
    margin-bottom:14px !important;
  }

  .page-id-103 .projects-filters{
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    gap:10px !important;
    margin:0 0 20px 0 !important;
    padding:6px 0 10px 0 !important;
    overflow:visible !important;
  }

  .page-id-103 .projects-filter{
    font-size:.92rem !important;
    min-height:42px !important;
    padding:10px 18px !important;
    border-radius:999px !important;
    overflow:visible !important;
    box-shadow:none !important;
  }

  .page-id-103 .projects-filter[data-filter="turisme"],
  .page-id-103 .projects-filter[data-filter="cultura"]{
    font-size:0 !important;
  }

  .page-id-103 .projects-filter[data-filter="turisme"]::after,
  .page-id-103 .projects-filter[data-filter="cultura"]::after{
    font-size:.78rem !important;
    line-height:1 !important;
    font-family:"Arial Rounded MT" !important;
  }

  .page-id-103 .projects-filter[data-filter="turisme"]::after{
    content:"Turisme";
  }

  .page-id-103 .projects-filter[data-filter="cultura"]::after{
    content:"Cultura";
  }

  .page-id-103 .projects-filter.active{
    border:1.5px solid #f3b03f !important;
    box-shadow:0 0 14px rgba(243,176,63,0.16) !important;
  }

}
	/* ======================================================
   PAGE 103 · MENU DESAPAREIX SOTA LA LÍNIA GROGA
   ====================================================== */

@media (max-width:768px){

  .page-id-103 .social-cases{
    position:relative;
    z-index:10;
  }

  .page-id-103 .mm-premium-menu{
    z-index:5;
  }

}
/* ======================================================
   PAGE 103 · ocultar menú mòbil en entrar a projectes
   ====================================================== */
@media (max-width:768px){

  body.page-id-103 .mm-premium-menu{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transition:opacity .25s ease, transform .25s ease, visibility .25s ease;
  }

  body.page-id-103.projects-menu-hidden .mm-premium-menu{
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateY(-8px) !important;
  }

}


/* HERO · mida correcta del títol */

.home-hero h1{
  font-size:clamp(28px, 3.2vw, 48px) !important;
  line-height:1.15 !important;
  max-width:620px !important;
}

/* separació amb el logo */
.home-hero .hero-logo{
  margin-bottom:28px !important;
}

/* subtítol */
.home-hero h5{
  font-size:clamp(15px, 1.2vw, 20px) !important;
}
/* HERO · logo i titular responsive */

.home-hero .hero-logo,
.hero-logo{
  width:clamp(190px, 18vw, 320px) !important;
  max-width:32vw !important;
  margin:0 auto 26px !important;
}

.home-hero .hero-logo img,
.hero-logo img{
  width:100% !important;
  height:auto !important;
  display:block !important;
}

.home-hero h1{
  font-size:clamp(30px, 4.2vw, 54px) !important;
  line-height:1.08 !important;
  max-width:min(760px, 62vw) !important;
  margin:0 auto !important;
  text-wrap:balance !important;
}

.home-hero-content{
  width:min(860px, 78vw) !important;
  margin:0 auto !important;
}

.home-hero h5,
.home-hero p{
  max-width:min(640px, 56vw) !important;
  margin:22px auto 0 !important;
}

/* portàtil més estret */
@media (max-width:1366px){
  .home-hero h1{
    max-width:min(680px, 58vw) !important;
    font-size:clamp(28px, 3.8vw, 48px) !important;
  }

  .home-hero .hero-logo,
  .hero-logo{
    width:clamp(170px, 16vw, 270px) !important;
  }
}

		/* HERO · títol controlat */

.home-hero h1{
  font-size:clamp(26px, 2.6vw, 42px) !important;
  line-height:1.15 !important;
  max-width:540px !important;
  margin:0 auto !important;
}

/* limitar el bloc de text perquè no s'estengui cap a la dreta */

.home-hero-content{
  max-width:620px !important;
  margin:0 auto !important;
}

/* REFINAMENT PREMIUM SOCIAL CASES */

.social-case-head{
  padding:34px 0 26px;
}

.social-case-grid{
  gap:38px;
}

.social-case-title{
  font-size:2.35rem;
  line-height:1.02;
  letter-spacing:-0.3px;
}

.social-case-copy{
  max-width:640px;
  font-size:1.08rem;
  line-height:1.62;
  color:rgba(255,255,255,0.88);
}

.social-case-channels{
  display:flex;
  flex-direction:column;
  gap:6px;
  align-items:flex-start;
}

.social-case-channels span{
  color:rgba(255,255,255,0.78);
}

.social-case-visuals{
  position:relative;
  min-height:520px;
  overflow:hidden;
  border-radius:24px;
  background:#1f3140;
  box-shadow:0 24px 60px rgba(0,0,0,0.18);
}

.social-case-hero{
  position:absolute;
  inset:0;
  overflow:hidden;
  border-radius:24px;
}

.social-case-hero img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  transform:scale(1.02);
  filter: grayscale(100%) contrast(1.08) brightness(0.72) sepia(0.10);
}

/* degradat premium principal */
.social-case-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    to bottom,
    rgba(34,53,69,0.46) 0%,
    rgba(34,53,69,0.34) 22%,
    rgba(34,53,69,0.38) 48%,
    rgba(34,53,69,0.52) 72%,
    rgba(34,53,69,0.70) 100%
  );
  z-index:1;
}

.social-case-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    to right,
    rgba(34,53,69,0.18) 0%,
    rgba(34,53,69,0.22) 35%,
    rgba(34,53,69,0.42) 68%,
    rgba(34,53,69,0.68) 100%
  );
  z-index:1;
}

/* vel lateral perquè els mòbils llegeixin millor */
.social-case-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    to right,
    rgba(34,53,69,0.00) 0%,
    rgba(34,53,69,0.04) 38%,
    rgba(34,53,69,0.18) 62%,
    rgba(34,53,69,0.42) 82%,
    rgba(34,53,69,0.58) 100%
  );
  z-index:1;
}

.social-case-side{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  padding:42px 56px 42px 42px;
  display:flex;
  justify-content:flex-end;
  align-items:center;
}

.social-case-phones{
  display:flex;
  gap:20px;
  align-items:flex-end;
}

.phone-card{
  position:relative;
}

.phone-card:first-child{
  transform:translateY(-14px);
}

.phone-card:last-child{
  transform:translateY(10px);
}

.phone-frame{
  position:relative;
  width:214px;
  border-radius:30px;
  background:#111820;
  padding:12px;
  box-shadow:
    0 18px 36px rgba(0,0,0,0.22),
    0 8px 18px rgba(0,0,0,0.18);
}

.phone-frame img{
  border-radius:18px;
}

.social-case-panel{
  padding:0 0 46px;
}

/* microefecte en obrir */
.social-case.is-open .social-case-hero img{
  transform:scale(1.04);
  transition:transform 1.4s ease;
}

@media (max-width: 1100px){
  .social-case-visuals{
    min-height:430px;
  }

  .social-case-side{
    padding:28px;
  }

  .phone-frame{
    width:182px;
  }
}

@media (max-width: 768px){
  .social-case-head{
    padding:24px 0 20px;
  }

  .social-case-title{
    font-size:1.9rem;
  }

  .social-case-copy{
    font-size:1rem;
    line-height:1.55;
  }

  .social-case-visuals{
    min-height:340px;
    border-radius:18px;
  }

  .social-case-hero,
  .social-case-hero img{
    border-radius:18px;
  }

  .social-case-side{
    padding:18px;
  }

  .phone-card:first-child,
  .phone-card:last-child{
    transform:none;
  }

  .phone-frame{
    width:145px;
    border-radius:22px;
    padding:9px;
  }

  .phone-frame img{
    border-radius:14px;
  }
}
/* CONNECTAR TEXT + HERO */

.social-case-head{
  padding:34px 0 14px;
}

.social-case-panel{
  padding:0 0 46px;
  margin-top:-6px;
}

.social-case-visuals{
  margin-top:0;
  min-height:480px;
  border-radius:24px;
  overflow:hidden;
  position:relative;
}

/* capa superior per fondre millor amb el text */
.social-case-visuals::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:120px;
  z-index:2;
  background:linear-gradient(
    to bottom,
    rgba(34,53,69,0.28) 0%,
    rgba(34,53,69,0.12) 45%,
    rgba(34,53,69,0.00) 100%
  );
  pointer-events:none;
}

.social-case-hero{
  z-index:1;
}

.social-case-side{
  z-index:3;
}

/* més integració visual */
.social-case.is-open .social-case-visuals{
  box-shadow:0 24px 60px rgba(0,0,0,0.16);
}

@media (max-width: 768px){
  .social-case-head{
    padding:24px 0 12px;
  }

  .social-case-panel{
    margin-top:0;
  }

  .social-case-visuals::before{
    height:70px;
  }
}
/* animació premium hero en obrir */

.social-case-hero img{
  transform:scale(1.02);
  transition:transform 1.2s ease;
}

.social-case-panel{
  padding:0 0 40px;
  opacity:0;
  transform:translateY(18px);
  max-height:0;
  overflow:hidden;
  transition:
    opacity .35s ease,
    transform .45s ease,
    max-height .6s ease;
}

.social-case.is-open .social-case-panel{
  opacity:1;
  transform:translateY(0);
  max-height:1400px;
}

.social-case.is-open .social-case-hero img{
  transform:scale(1.06);
}
.social-case-phones{
  opacity:0;
  transform:translateY(14px);
  transition:opacity .35s ease .08s, transform .45s ease .08s;
}

.social-case.is-open .social-case-phones{
  opacity:1;
  transform:translateY(0);
}
/* zoom cinematogràfic de la hero */

.social-case.is-open .social-case-hero img{
  animation:heroZoomStart 3.5s ease-out forwards,
           heroZoomDrift 22s linear 3.5s infinite alternate;
}

@keyframes heroZoom{
  0%{
    transform:scale(1);
  }
  100%{
    transform:scale(1.04);
  }
}
@keyframes heroZoomStart{
  0%{
    transform:scale(1);
  }
  100%{
    transform:scale(1.04);
  }
}

@keyframes heroZoomDrift{
  0%{
    transform:scale(1.04);
  }
  100%{
    transform:scale(1.06);
  }
}
/* capa subtil sobre el fons quan s'obre un projecte */

.social-case.is-open{
  position:relative;
}
/* capa subtil sobre el fons quan s'obre un projecte */

.social-case.is-open{
  position:relative;
  padding-left:0;
  padding-right:0;
  border-radius:0;
  box-shadow:none;
}

.social-case.is-open::before{
  content:"";
  position:absolute;
  inset:-60px -60px;
  background:rgba(20,30,40,0.25);
  pointer-events:none;
  z-index:-1;
}
.social-case.is-open{
  position:relative;
  padding-left:44px;
  padding-right:44px;
  border-radius:18px;
  box-shadow:0 18px 45px rgba(0,0,0,0.12);
}

.social-case.is-open::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:-80px;
  right:-80px;
  background:rgba(255,255,255,0.035);
  border-radius:18px;
  z-index:-1;
}
.social-case{
  transition:background .25s ease, box-shadow .25s ease;
  border-radius:18px;
}

.social-case:hover{
  background:rgba(255,255,255,0.02);
  box-shadow:0 8px 24px rgba(0,0,0,0.08);
}

.social-case.is-open .social-case-visuals{
  margin-top:40px !important;
}
.social-case-head .social-case-title{
  font-size:1.42rem !important;
  opacity:.85;
}
/* TREURE EFECTE TARGETA / FLOTANT DEL PROJECTE OBERT */

.social-case.is-open{
  position:relative;
  padding-left:0 !important;
  padding-right:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}

.social-case.is-open::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:50%;
  width:100vw;
  transform:translateX(-50%);
  background:rgba(20,30,40,0.18);
  pointer-events:none;
  z-index:-1;
}

.social-case-visuals{
  border-radius:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}

.social-case-hero{
  border-radius:0 !important;
  box-shadow:none !important;
}

.social-case-hero img{
  border-radius:0 !important;
}

.social-case-panel{
  box-shadow:none !important;
}

.social-case:hover{
  border-radius:0 !important;
  box-shadow:none !important;
}
.social-cases{
  width: 100%;
}

.social-cases .container{
  max-width: 1240px !important;
  width: calc(100% - 80px) !important;
  margin: 0 auto !important;
}

@media (max-width: 768px){
  .social-cases .container{
    width: calc(100% - 32px) !important;
  }
}
/* INTEGRACIÓ PREMIUM DEL PROJECTE OBERT */

.social-case{
  position:relative;
}

/* rebaixar el blanc i negre excessiu */
.social-case-hero img{
  filter: grayscale(18%) contrast(1.04) brightness(0.76) saturate(0.92) !important;
}

/* quan el projecte s'obre, la capçalera passa damunt de la hero */
.social-case.is-open .social-case-toggle{
  position:absolute;
  top:0;
  left:0;
  right:0;
  z-index:8;
  width:100%;
}

/* el text queda superposat sobre la imatge */
.social-case.is-open .social-case-head{
  padding:42px 44px 0 !important;
  background:linear-gradient(
    to bottom,
    rgba(34,53,69,0.92) 0%,
    rgba(34,53,69,0.78) 34%,
    rgba(34,53,69,0.42) 72%,
    rgba(34,53,69,0.00) 100%
  );
}

/* en obert, el panell puja i s'enganxa a dalt */
.social-case.is-open .social-case-panel{
  margin-top:0 !important;
  padding:0 0 40px !important;
}

/* la hero comença des de dalt i reserva espai per al text superposat */
.social-case.is-open .social-case-visuals{
  margin-top:0 !important;
  min-height:660px;
  padding-top:180px;
}

/* fer més protagonista el contingut de text quan és damunt la imatge */
.social-case.is-open .social-case-title{
  font-size:2.15rem !important;
  line-height:1.02;
  opacity:1 !important;
  margin-left:0 !important;
  text-shadow:0 3px 20px rgba(0,0,0,0.22);
}

.social-case.is-open .social-case-copy{
  max-width:720px;
  color:rgba(255,255,255,0.96) !important;
  text-shadow:0 2px 16px rgba(0,0,0,0.20);
}

.social-case.is-open .social-case-channels span{
  color:rgba(255,255,255,0.88) !important;
  text-shadow:0 2px 16px rgba(0,0,0,0.20);
}

/* botó més integrat damunt la imatge */
.social-case.is-open .social-case-plus{
  background:rgba(34,53,69,0.22);
  backdrop-filter:blur(4px);
}

/* mòbils més avall perquè no xoquin amb el text */
.social-case.is-open .social-case-side{
  padding:72px 56px 42px 42px !important;
  align-items:flex-end;
}

/* lleu retard del segon mòbil */
.social-case.is-open .phone-card:last-child{
  transition-delay:.12s;
}

/* la peça oberta ha de respirar com una sola escena */
.social-case.is-open .social-case-visuals::before{
  height:170px !important;
  background:linear-gradient(
    to bottom,
    rgba(34,53,69,0.38) 0%,
    rgba(34,53,69,0.16) 48%,
    rgba(34,53,69,0.00) 100%
  );
}

/* mòbil i tablet */
@media (max-width: 900px){
  .social-case.is-open .social-case-head{
    padding:26px 22px 0 !important;
  }

  .social-case.is-open .social-case-grid{
    grid-template-columns:1fr;
    gap:14px;
  }

  .social-case.is-open .social-case-visuals{
    min-height:560px;
    padding-top:240px;
  }

  .social-case.is-open .social-case-title{
    font-size:1.9rem !important;
  }

  .social-case.is-open .social-case-side{
    padding:26px 22px 20px 22px !important;
  }
}

/* mòbil petit */
@media (max-width: 768px){
  .social-case.is-open .social-case-visuals{
    min-height:500px;
    padding-top:250px;
  }

  .social-case.is-open .social-case-title{
    font-size:1.7rem !important;
  }

  .social-case.is-open .social-case-copy{
    font-size:1rem !important;
    line-height:1.5;
  }
}
/* focus visual quan un projecte està obert */

.social-cases:has(.social-case.is-open) .social-case:not(.is-open){
  opacity:.45;
  transform:scale(.99);
  transition:opacity .35s ease, transform .35s ease;
}

.social-cases:has(.social-case.is-open) .social-case:not(.is-open):hover{
  opacity:.65;
}
/* =========================
   PORTFOLI AUDIOVISUAL
   ========================= */

.audiovisual-page{
  position:relative;
  min-height:100vh;
  padding:56px 0 90px;
  background:
    radial-gradient(circle at 50% 28%, rgba(58,86,108,0.28) 0%, rgba(34,53,69,0.10) 34%, rgba(34,53,69,0.96) 100%),
    #223545;
  overflow:hidden;
}

.audiovisual-nav{
  position:fixed;
  top:360px;
  left:50%;
  transform:translateX(-50%);
  z-index:9999;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:34px;
  padding:0;
  background:transparent;
  box-shadow:none;
  pointer-events:auto;
}

.audiovisual-nav .nav-item{
  color:rgba(255,255,255,0.72);
  font-size:1rem;
  line-height:1;
  cursor:pointer;
  position:relative;
  transition:color .25s ease, opacity .25s ease;
  pointer-events:auto;
}

.audiovisual-nav .nav-item:hover{
  color:#ffffff;
}

.audiovisual-nav .nav-item.active{
  color:#ffffff;
}

.audiovisual-nav .nav-item.active::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-10px;
  margin:auto;
  width:100%;
  height:2px;
  border-radius:999px;
  background:#f3b03f;
}

.audiovisual-mode{
  display:none !important;
  position:relative !important;
  height:100% !important;
  min-height:0 !important;
  overflow:hidden !important;
  flex:1;
}

.audiovisual-mode.active{
  display:block !important;
}

.audiovisual-track{
  position:relative !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  overflow:hidden !important;
}

.audiovisual-slide{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transform:translateY(18px) !important;
  transition:opacity .45s ease, transform .45s ease, visibility .45s ease !important;
}

.audiovisual-slide.active{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transform:translateY(0) !important;
  z-index:2 !important;
}

.audiovisual-videos,
.audiovisual-reels,
.audiovisual-photos{
  overflow:hidden !important;
}

/* VÍDEOS */

.video-stage{
  max-width:1180px;
  margin:0 auto;
  padding:18px 34px 0;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  width:100% !important;
}

.video-item{
  position:relative;
  width:100%;
  max-width:820px;
  margin:0 auto;
  aspect-ratio:16 / 9;
  border-radius:20px;
  overflow:hidden;
  background:#182633;
  box-shadow:
    0 28px 70px rgba(0,0,0,0.22),
    0 14px 28px rgba(0,0,0,0.12);
}

.video-item video{
  width:100% !important;
  height:100% !important;
  display:block !important;
  object-fit:cover !important;
  object-position:center center !important;
  max-width:none !important;
  transform:translateZ(0);
}

.video-item::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:45%;
  background:linear-gradient(to top, rgba(0,0,0,0.55), rgba(0,0,0,0));
  pointer-events:none;
}

.video-caption{
  position:absolute;
  bottom:32px;
  left:34px;
  z-index:5;
  text-align:left;
  margin:0;
  padding:0;
  max-width:none;
}

.video-caption::before{
  display:none;
}

.video-title{
  margin:0 0 4px 0;
  font-family:"Arial Rounded MT";
  font-size:32px;
  font-weight:600;
  line-height:1.04;
  color:#ffffff;
  letter-spacing:-0.2px;
}

.video-subtitle{
  margin:0;
  font-size:15px;
  line-height:1.45;
  color:rgba(255,255,255,0.68);
  letter-spacing:.3px;
}

.video-counter{
  position:absolute;
  top:26px;
  right:32px;
  z-index:10;
  font-family:"Varela Round", sans-serif;
  font-size:14px;
  letter-spacing:2px;
  color:rgba(255,255,255,0.85);
  display:flex;
  align-items:center;
  gap:6px;
  pointer-events:none;
  transition:opacity .4s ease, transform .4s ease;
}

.video-counter::before{
  content:"";
  display:block;
  width:1px;
  height:18px;
  background:rgba(255,255,255,0.28);
  margin-right:10px;
}

.video-current{
  font-weight:600;
  color:rgba(255,255,255,0.96);
}

.video-divider{
  opacity:.5;
}

.video-total{
  opacity:.6;
}

.audiovisual-slide:not(.active) .video-counter{
  opacity:0;
  transform:translateY(-6px);
}



/* FOTOS */

.photo-stage{
  min-height:78vh;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  width:100% !important;
}

.photo-item{
  max-width:980px;
  margin:0 auto;
}

.photo-item img{
width:100%;
display:block;
aspect-ratio:3 / 2;
object-fit:cover;
object-position:center center;
border-radius:28px;
}

.photo-placeholder{
  width:100%;
  aspect-ratio:3 / 2;
  border-radius:28px;
  background:linear-gradient(
    135deg,
    rgba(255,255,255,0.05) 0%,
    rgba(255,255,255,0.02) 100%
  );
}


/* RESPONSIVE */

@media (max-width: 1100px){
  .video-stage,
  .photo-stage{
    padding-left:24px;
    padding-right:24px;
  }
}

@media (max-width: 768px){
  .audiovisual-page{
    padding:54px 0 70px;
  }

  .audiovisual-nav{
    top:150px;
    gap:22px;
    width:max-content;
  }

  .audiovisual-nav .nav-item{
    font-size:.92rem;
  }

  .video-stage,
  .photo-stage{
    padding-left:16px;
    padding-right:16px;
  }

  .video-item,
  .photo-item img,
  .photo-placeholder{
    border-radius:22px;
  }

  .video-caption{
    left:22px;
    bottom:20px;
  }

  .video-title{
    font-size:1.65rem;
  }

  .video-subtitle{
    font-size:.95rem;
  }

  .video-counter{
    top:18px;
    right:20px;
    font-size:12px;
    letter-spacing:1.5px;
  }

  .video-counter::before{
    height:14px;
    margin-right:8px;
  }
}



/* =========================
   FIX FONS SECCIÓ DESTACATS
   ========================= */

.destacats{
  background:#223545 !important;
  padding-top:40px;
  padding-bottom:90px;
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
}

.destacats .destacat{
  max-width:900px;
  margin:30px auto 22px auto;
}
}

/* =========================
   MENÚ PREMIUM GLOBAL
   ========================= */

.mm-premium-menu{
  position:fixed;
  top:88px;
  right:42px;
  z-index:999999;
}

.mm-premium-trigger{
  appearance:none;
  -webkit-appearance:none;
  display:flex;
  align-items:center;
  justify-content:center;
  width:104px;
  height:46px;
  padding:0 20px;
  border:1px solid rgba(255,255,255,0.35);
  border-radius:999px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.35);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:
    0 8px 20px rgba(0,0,0,0.15),
    inset 0 1px 0 rgba(255,255,255,0.25);
  cursor:pointer;
  outline:none;
  transition:
    border-color .25s ease,
    background .25s ease,
    transform .25s ease,
    box-shadow .25s ease;
}

.mm-premium-trigger span{
  color:#ffffff;
  font-family:"Arial Rounded MT";
  font-size:14px;
  line-height:1;
  letter-spacing:.08em;
  text-transform:uppercase;
  transition:color .25s ease;
}

.mm-premium-trigger:hover,
.mm-premium-trigger:focus,
.mm-premium-trigger:focus-visible,
.mm-premium-trigger:active,
.mm-premium-trigger[aria-expanded="true"]{
  border-color:#f3b03f;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.04)),
    rgba(34,53,69,0.45);
  box-shadow:
    0 10px 26px rgba(0,0,0,0.22),
    0 0 10px rgba(243,176,63,0.25);
  transform:translateY(-1px);
}

.mm-premium-trigger:hover span,
.mm-premium-trigger:focus span,
.mm-premium-trigger:focus-visible span,
.mm-premium-trigger:active span,
.mm-premium-trigger[aria-expanded="true"] span{
  color:#f3b03f;
}

.mm-premium-trigger,
.mm-premium-trigger *{
  -webkit-tap-highlight-color:transparent;
}

.mm-premium-overlay{
  position:fixed;
  inset:0;
  z-index:999998;
  background:rgba(20,30,40,0.24);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .35s ease, visibility .35s ease;
}

.mm-premium-overlay.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.mm-premium-inner{
  position:relative;
  width:100%;
  height:100%;
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  padding:120px 60px 40px 40px;
}

.mm-premium-panel{
  position:relative;
  width:min(360px, 88vw);
  min-height:560px;
  border-radius:28px;
  border:1px solid rgba(243,176,63,0.55);
  background:
    linear-gradient(145deg, rgba(255,255,255,0.10), rgba(255,255,255,0.03)),
    linear-gradient(180deg, rgba(34,53,69,0.48), rgba(34,53,69,0.36));
  backdrop-filter:blur(28px) saturate(160%);
  -webkit-backdrop-filter:blur(28px) saturate(160%);
  box-shadow:
    0 30px 80px rgba(0,0,0,0.35),
    0 0 18px rgba(243,176,63,0.25),
    inset 0 1px 0 rgba(255,255,255,0.18);
  overflow:hidden;
}

.mm-premium-panel::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 20% 10%, rgba(255,255,255,0.18), transparent 40%);
  opacity:.6;
  pointer-events:none;
}

.mm-premium-panel-content{
  min-height:530px;
  padding:34px 42px 30px;
  display:grid;
  grid-template-rows:1fr auto auto;
  align-items:center;
}

.mm-premium-close{
  position:absolute;
  top:20px;
  right:20px;
  width:46px;
  height:46px;
  padding:0;
  border:1px solid rgba(255,255,255,0.18);
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  color:#ffffff;
  font-size:26px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  outline:none;
  transition:background .25s ease, border-color .25s ease, transform .25s ease, color .25s ease, box-shadow .25s ease;
}

.mm-premium-close:hover{
  color:#f3b03f;
  background:rgba(255,255,255,0.08);
  border-color:#f3b03f;
  box-shadow:0 0 10px rgba(243,176,63,0.35);
  transform:translateY(-1px);
}

.mm-premium-nav{
  width:100%;
  max-width:340px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  text-align:left;
}

.mm-premium-nav,
.mm-premium-nav *,
.mm-menu-item,
.mm-menu-item::before,
.mm-menu-item::after{
  background:transparent !important;
  background-color:transparent !important;
  box-shadow:none !important;
}

.mm-menu-item{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  width:100%;
  padding:22px 0;
}

.mm-menu-item:not(:last-child)::after{
  content:"";
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:1px;
  background:rgba(243,176,63,0.18);
}

.mm-menu-item > a,
.mm-menu-toggle{
  all:unset;
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:"Arial Rounded MT";
  font-size:clamp(1.9rem, 2vw, 2.25rem);
  line-height:1.08;
  letter-spacing:.01em;
  color:rgba(255,255,255,0.92);
  cursor:pointer;
  text-decoration:none;
  transition:color .25s ease, opacity .25s ease;
}

.mm-menu-item > a:hover,
.mm-menu-toggle:hover,
.mm-menu-toggle:focus{
  color:#f3b03f;
  outline:none;
}

.mm-menu-item-collapsible.is-open .mm-menu-toggle{
  color:rgba(255,255,255,0.92);
}

.mm-menu-toggle::after{
  content:"▾";
  font-size:14px;
  color:rgba(243,176,63,0.78);
  transform:translateY(1px);
  transition:transform .25s ease, color .25s ease;
}

.mm-menu-item-collapsible.is-open .mm-menu-toggle::after{
  color:#f3b03f;
  transform:rotate(180deg);
}

.mm-menu-desc{
  width:100%;
  margin-top:6px;
  font-size:12px;
  line-height:1.65;
  letter-spacing:.03em;
  text-align:left;
  color:rgba(243,176,63,0.68);
}

.mm-menu-desc a,
.mm-menu-desc a:hover,
.mm-menu-desc a:focus,
.mm-menu-desc a:active,
.mm-menu-desc a:visited{
  all:unset;
  display:block;
  width:100%;
  cursor:pointer;
  color:rgba(255,255,255,0.88);
  font-size:15px;
  line-height:1.45;
  letter-spacing:.02em;
  text-align:left;
  padding:10px 0;
  text-decoration:none;
  transition:color .25s ease, opacity .25s ease;
}

.mm-menu-desc a:hover{
  color:#ffffff;
  opacity:1;
}

.mm-menu-submenu a:not(:last-child){
  border-bottom:1px solid rgba(255,255,255,0.12);
}

.mm-premium-bottom-links{
  width:100%;
  max-width:340px;
  margin:0 auto;
  padding-top:18px;
  border-top:1px solid rgba(243,176,63,0.14);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
}

.mm-premium-bottom-links a,
.mm-premium-bottom-links a:hover,
.mm-premium-bottom-links a:focus,
.mm-premium-bottom-links a:active,
.mm-premium-bottom-links a:visited{
  all:unset;
  display:inline-block;
  cursor:pointer;
  color:rgba(255,255,255,0.82);
  font-family:"Arial Rounded MT";
  font-size:1.15rem;
  line-height:1.1;
  text-decoration:none;
  transition:color .25s ease, opacity .25s ease;
}

.mm-premium-bottom-links a:hover{
  color:#f3b03f;
  opacity:1;
}

.mm-premium-meta{
  width:100%;
  max-width:340px;
  margin:18px auto 0;
  padding-top:18px;
  border-top:1px solid rgba(243,176,63,0.14);
  display:flex;
  justify-content:flex-start;
  align-items:center;
  gap:28px;
  flex-wrap:wrap;
}

.mm-premium-meta a,
.mm-premium-meta a:hover,
.mm-premium-meta a:focus,
.mm-premium-meta a:active,
.mm-premium-meta a:visited{
  all:unset;
  display:inline-block;
  cursor:pointer;
  font-size:13px;
  color:rgba(255,255,255,0.50);
  letter-spacing:.04em;
  transition:color .25s ease;
}

.mm-premium-meta a:hover{
  color:#f3b03f;
}

body.mm-menu-open{
  overflow:hidden;
}

body:not(.page-id-329) [data-section="section-header-mobile-trigger"]{
  display:none !important;
}

@media (max-width: 921px){
  .mm-premium-menu{
    top:104px;
    right:24px;
  }

  .mm-premium-inner{
    padding:18px;
  }

  .mm-premium-panel{
    width:calc(100vw - 36px);
    min-height:560px;
    border-radius:24px;
  }

  .mm-premium-panel-content{
    min-height:560px;
    padding:70px 26px 28px;
  }

  .mm-premium-nav,
  .mm-premium-bottom-links,
  .mm-premium-meta{
    max-width:100%;
  }

  .mm-menu-item{
    padding:18px 0;
  }

  .mm-menu-item > a,
  .mm-menu-toggle{
    font-size:2rem;
  }

  .mm-menu-desc a{
    font-size:14px;
  }

  .mm-premium-bottom-links a{
    font-size:1.05rem;
  }

  .mm-premium-meta{
    gap:18px;
  }

  .mm-premium-close{
    top:16px;
    right:16px;
    width:42px;
    height:42px;
    font-size:24px;
  }

  .mm-premium-trigger{
    width:112px;
    height:52px;
    padding:0 22px;
  }

  .mm-premium-trigger span{
    font-size:15px;
  }
}
/* MICROAJUST FINAL MENÚ PREMIUM */

.mm-premium-panel{
  width:min(72vw, 400px);
}

.mm-premium-nav{
  position:relative;
  top:-18px;
}

.mm-premium-bottom-links{
  max-width:300px;
  margin:0 auto;
}

.mm-premium-meta{
  justify-content:center;
}

@media (max-width: 921px){
  .mm-premium-panel{
    width:calc(100vw - 36px);
  }

  .mm-premium-nav{
    top:-10px;
  }

  .mm-premium-bottom-links{
    margin-top:10px;
  }

  .mm-premium-meta{
    margin-top:12px;
  }
}

/* PUJAR BLOC PRINCIPAL DEL MENÚ */

.mm-premium-nav{
  position:relative;
  top:-40px;
}

@media (max-width: 921px){
  .mm-premium-nav{
    top:-24px;
  }
}
/* PUJAR BLOC PRINCIPAL DEL MENÚ */

.mm-premium-nav{
  position:relative;
  top:-40px;
}

@media (max-width: 921px){
  .mm-premium-nav{
    top:-24px;
  }
}
/* AJUST FINAL NET MENÚ PREMIUM */

.mm-premium-panel{
  width:min(340px, 88vw);
}

.mm-premium-nav{
  position:relative;
  top:-14px;
}

.mm-premium-bottom-links{
  max-width:300px;
  margin:0 auto;
}

.mm-premium-meta{
  justify-content:center;
}

.mm-premium-nav .mm-menu-item > a,
.mm-premium-nav .mm-menu-toggle{
  font-size:1.7rem !important;
}

@media (max-width: 921px){
  .mm-premium-panel{
    width:calc(100vw - 36px);
  }

  .mm-premium-nav{
    top:-8px;
  }

  .mm-premium-bottom-links{
    margin-top:10px;
  }

  .mm-premium-meta{
    margin-top:12px;
  }

  .mm-premium-nav .mm-menu-item > a,
  .mm-premium-nav .mm-menu-toggle{
    font-size:1.55rem !important;
  }
}
.mm-premium-close:hover{
  color:#f3b03f !important;
  border-color:#f3b03f !important;
  box-shadow:0 0 10px rgba(243,176,63,0.35);
}
	
/* fer el botó MENU més petit sense trencar el layout */

.mm-premium-trigger{
  transform:scale(0.72);
  transform-origin:right center;
}

.mm-premium-trigger:hover,
.mm-premium-trigger:focus,
.mm-premium-trigger:focus-visible,
.mm-premium-trigger:active,
.mm-premium-trigger[aria-expanded="true"]{
  border-color:#f3b03f;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.04)),
    rgba(34,53,69,0.45);
  box-shadow:
    0 10px 26px rgba(0,0,0,0.22),
    0 0 10px rgba(243,176,63,0.25);
  transform:scale(0.72) translateY(-1px);
}
/* =========================
   CLIENTS DESTACATS PREMIUM
   ========================= */

.client-premium-card{

  position:relative;
  overflow:hidden;
  border-radius:28px;

  border:1px solid rgba(243,176,63,0.55);

  background:
    linear-gradient(145deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.35);

  backdrop-filter:blur(16px) saturate(150%);
  -webkit-backdrop-filter:blur(16px) saturate(150%);

  box-shadow:
    0 20px 50px rgba(0,0,0,0.25),
    inset 0 1px 0 rgba(255,255,255,0.18);

  transition:
    transform .35s ease,
    box-shadow .35s ease,
    border-color .35s ease;

}

/* glow suau com el menú */

.client-premium-card:hover{

  transform:translateY(-4px);

  border-color:#f3b03f;

  box-shadow:
    0 30px 80px rgba(0,0,0,0.35),
    0 0 18px rgba(243,176,63,0.25),
    inset 0 1px 0 rgba(255,255,255,0.25);

}

/* efecte llum premium */

.client-premium-card::before{

  content:"";
  position:absolute;
  inset:0;

  background:
    radial-gradient(circle at 20% 10%, rgba(255,255,255,0.10), transparent 45%);

  opacity:.35;
  pointer-events:none;
}

/* =========================
   REDUIR MIDA CLIENTS PREMIUM
   ========================= */

.clients-premium-grid{
  gap:28px; /* abans segurament és més gran */
}

.client-premium-card{
  max-height:420px; /* limita l'alçada */
}

.client-premium-card img{
  height:260px;
  object-fit:cover;
}
/* =========================
   CORRECCIÓ FADE CARTES
   ========================= */

.client-premium-card{
  position:relative;
  overflow:hidden;
}

/* imatge ocupa tota la carta */

.client-premium-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* degradat premium sobre la imatge */

.client-premium-card::after{
  content:"";
  position:absolute;
  inset:0;

  background:
    linear-gradient(
      to bottom,
      rgba(34,53,69,0) 35%,
      rgba(34,53,69,0.35) 55%,
      rgba(34,53,69,0.75) 100%
    );

  pointer-events:none;
}
/* =========================
   CORREGIR CENTRAT CARTES
   ========================= */

.destacats .destacat{
  position:relative;
  overflow:hidden;
  max-width:1050px;
  margin:40px auto;
  padding:64px 64px;
  border-radius:34px;
}

/* imatge ocupa tota la carta */

.client-premium-card img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
/* =========================
   FIX CENTRAT CLIENTS PREMIUM
   ========================= */

.clients-premium-grid{
  max-width:900px;
  margin:0 auto;
  padding:0;
  gap:22px;
}

.client-premium-card{
  width:100%;
  max-width:900px;
  margin:0 auto;
  aspect-ratio:16/8;
  position:relative;
  overflow:hidden;
}

/* totes les cartes exactament iguals */
.client-premium-card:first-child{
  aspect-ratio:16/8;
}

/* imatge ocupa tota la carta */
.client-premium-card img,
.client-premium-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
/* =========================
   REDUIR LOGOS CLIENTS
   ========================= */

/* reduir només el logo dels clients */

.client-premium-logo{
  width:140px;
  height:auto;
}

.client-premium-card .client-premium-logo img{
  width:120px;
  height:auto;
  object-fit:contain;
}
/* LOGOS DELS CLIENTS MÉS PETITS */
.client-premium-logo{
  top:22px !important;
  left:22px !important;
  max-width:150px !important;
  max-height:58px !important;
  width:auto !important;
  height:auto !important;
}

.client-premium-logo img{
  max-width:150px !important;
  max-height:58px !important;
  width:auto !important;
  height:auto !important;
  object-fit:contain !important;
}

/* =========================
   TARGETES HOME GLOW PREMIUM
   ========================= */

.destacats{
  background:#223545 !important;
  padding:40px 0 90px;
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
}

.destacats .destacat{
  position:relative;
  overflow:hidden;
  max-width:500px;
  margin:34px auto 22px;
  padding:52px 54px 46px;
  border-radius:34px;

  background:
    linear-gradient(145deg, rgba(255,255,255,0.09), rgba(255,255,255,0.02)),
    linear-gradient(180deg, rgba(39,63,82,0.88), rgba(29,48,64,0.92)) !important;

  border:1px solid rgba(243,176,63,0.42);

  backdrop-filter:blur(16px) saturate(145%);
  -webkit-backdrop-filter:blur(16px) saturate(145%);

  box-shadow:
    0 20px 55px rgba(0,0,0,0.22),
    0 0 18px rgba(243,176,63,0.10),
    inset 0 1px 0 rgba(255,255,255,0.14);

  transition:
    transform .32s ease,
    box-shadow .32s ease,
    border-color .32s ease,
    background .32s ease;
}

/* glow subtil */
.destacats .destacat:hover{
  transform:translateY(-4px);
  border-color:rgba(243,176,63,0.72);
  box-shadow:
    0 35px 80px rgba(0,0,0,0.32),
    0 0 28px rgba(243,176,63,0.30),
    inset 0 1px 0 rgba(255,255,255,0.20);
}

/* llum superior suau */
.destacats .destacat::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 10%, rgba(255,255,255,0.16), transparent 32%);
  opacity:.7;
}

/* peça decorativa superior esquerra */
.destacats .destacat::after{
  content:"";
  position:absolute;
  top:22px;
  left:22px;
  width:30px;
height:7px;
  border-radius:20px;
  background:#f3b03f;
box-shadow:
0 0 10px rgba(243,176,63,0.25),
0 1px 0 rgba(255,255,255,0.25) inset;
}

/* amagar la peça antiga */
.destacats .destacat .separador{
  display:none !important;
}

/* títol */
.destacats .destacat h3{
  margin-top:20px;
  margin-bottom:16px;
  color:#ffffff !important;
  text-align:left;
  font-family:"Arial Rounded MT";
  font-size:28px;
  line-height:1.15;
  text-transform:uppercase;
  letter-spacing:0.01em;
  font-weight:600;
}

/* text */
.destacats .destacat p{
  color:rgba(255,255,255,0.88) !important;
  font-size:17px;
  line-height:1.55;
  font-weight:normal;
  max-width:560px;
  margin:0;
  opacity:0.9;
}

/* text inferior */
.destacats .text-inferior{
  max-width:760px;
  margin:0 auto;
  color:rgba(255,255,255,0.72);
  font-size:1.2rem;
  line-height:1.5;
}

/* anul·lar qualsevol variant antiga de color */
.destacats .destacat.green,
.destacats .destacat.pink,
.destacats .destacat.yellow{
  background:
    linear-gradient(145deg, rgba(255,255,255,0.09), rgba(255,255,255,0.02)),
    linear-gradient(180deg, rgba(39,63,82,0.88), rgba(29,48,64,0.92)) !important;
}

/* mòbil */
@media (max-width:768px){
  .destacats{
    padding:26px 16px 60px;
  }

  .destacats .destacat{
    max-width:100%;
    margin:18px auto 16px;
    padding:30px 26px 28px;
    border-radius:28px;
  }

  .destacats .destacat::after{
    top:18px;
    left:18px;
    width:46px;
    height:8px;
  }

  .destacats .destacat h3{
    margin-top:40px;
    margin-bottom:14px;
    font-size:2rem !important;
    line-height:1.08;
  }

  .destacats .destacat p{
    max-width:100%;
    font-size:1.2rem !important;
    line-height:1.35;
  }

  .destacats .text-inferior{
    font-size:1rem;
    line-height:1.45;
  }
}
/* =========================
   UNIFICAR FONS HOME
   ========================= */

.home,
.home #primary,
.home .site-content,
.home .entry-content,
.home .top-home,
.home .millennials,
.home .support,
.home .destacats,
.home .estrategies,
.home .galeria,
.home .clients,
.home .video,
.home .values-premium,
.home .clients-premium{
  background:#223545 !important;
  background-image:none !important;
}
/* =========================
   LÍNIA BLANCA ENTRE HERO I FRANJA VERDA
   ========================= */

.home .home-hero{
border-top:none !important;
}
/* =========================
   AMAGAR PROJECTES DESTACATS HOME
   ========================= */

.home .clients-premium{
  display:none !important;
}
/* =========================
   FRANJA CLIENTS HOME
   ========================= */

.clients-marquee{
  width:100%;
  overflow:hidden;
  padding:18px 0 8px;
  background:transparent;
}

.clients-marquee-inner{
  display:flex;
  align-items:center;
  gap:72px;
  width:max-content;
  animation:clientsScroll 26s linear infinite;
}

.clients-marquee a{
  display:inline-flex;
  align-items:center;
}

.clients-marquee img{
  height:34px;
  width:auto;
  opacity:.78;
  transition:opacity .3s ease;
}

.clients-marquee a:hover img,
.clients-marquee img:hover{
  opacity:1;
}

@keyframes clientsScroll{
  0%{
    transform:translateX(0);
  }
  100%{
    transform:translateX(-50%);
  }
}

@media (max-width:768px){
  .clients-marquee{
    padding:14px 0 4px;
  }

  .clients-marquee-inner{
    gap:42px;
  }

  .clients-marquee img{
    height:24px;
  }
}
/* =========================
   AMAGAR SECCIÓ ESTRATÈGIES A LA HOME
   ========================= */

.home .estrategies{
  display:none !important;
}
/* =========================
   SECCIÓ EQUIP FONS FOSC
   ========================= */

.home .equip{
  background:#223545;
  color:#ffffff;
}

/* noms */

.home .equip .person h4{
  color:#ffffff;
}

/* descripció */

.home .equip .person p{
  color:#e6eef2;
}
.home .equip{
  background:#223545;
  color:#ffffff;
  padding:80px 0;
}
/* =========================
   SECCIÓ EQUIP ESTIL PREMIUM
   ========================= */

.home .equip{
  background:#223545;
  color:#ffffff;
  padding:90px 0;
}

/* grid més equilibrat */

.home .equip .grid{
  max-width:1100px;
  margin:0 auto;
  gap:70px;
}

/* targeta persona */

.home .equip .person{
  text-align:center;
  max-width:280px;
  margin:0 auto;
}

/* nom */

.home .equip .person h4{
  color:#ffffff;
  font-size:28px;
  font-weight:600;
  margin-bottom:12px;
  letter-spacing:.02em;
}

/* petita línia sota el nom */

.home .equip .person h4:after{
  content:"";
  display:block;
  width:26px;
  height:3px;
  background:#6fa79c;
  margin:10px auto 18px;
  border-radius:2px;
}

/* descripció */

.home .equip .person p{
  color:#c9d6dc;
  font-size:15px;
  line-height:1.6;
  max-width:240px;
  margin:0 auto;
}
/* =========================
   TREURE LOGO A LA SECCIÓ EQUIP
   ========================= */

.home .millennials .title .millennials{
  display:none;
}

/* =========================
   EQUIP PREMIUM HOME
   ========================= */

/* bloc general */
.home .equip{
  background:#223545 !important;
  color:#ffffff;
  padding:100px 0 110px;
}

/* amagar logo redundant de Millennials abans de l'equip */
.home .millennials .title .millennials{
  display:none !important;
}

/* contenidor del títol "equip" */
.home .millennials{
  background:#223545 !important;
  padding:30px 0 10px;
}

.home .millennials .title{
  max-width:none;
  margin:0 auto;
  padding:0;
  text-align:center;
  color:#f3b03f;
  font-family:"Varela Round";
  font-size:20px;
  font-weight:normal;
  letter-spacing:.08em;
  text-transform:uppercase;
  position:relative;
}

/* línia premium sota el títol */
.home .millennials .title::after{
  content:"";
  display:block;
  width:54px;
  height:2px;
  margin:16px auto 0;
  border-radius:999px;
  background:rgba(243,176,63,0.72);
}

/* grid */
.home .equip .grid{
  max-width:1080px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:64px 54px;
  align-items:start;
}

/* peça */
.home .equip .person{
  text-align:center;
  max-width:250px;
  margin:0 auto;
  color:#ffffff;
}

/* nom */
.home .equip .person h4{
  font-family:"Arial Rounded MT";
  font-size:30px;
  line-height:1.08;
  font-weight:600;
  color:#ffffff !important;
  margin:0 0 10px;
  letter-spacing:.01em;
}

/* línia sota nom */
.home .equip .person h4::after{
content:"";
display:block;
width:24px;
height:3px;
margin:12px auto 0;
border-radius:999px;
background:#f3b03f;
opacity:.9;
}

/* descripció */
.home .equip .person p{
  margin:0;
  font-family:"Varela Round";
  font-size:16px;
  line-height:1.65;
  color:rgba(255,255,255,0.78) !important;
  max-width:230px;
  margin-left:auto;
  margin-right:auto;
}

/* si hi ha enllaços o format dins del text */
.home .equip .person p a{
  color:rgba(255,255,255,0.78) !important;
  text-decoration:none;
}

/* suavitzar qualsevol verd massa intens heretat */
.home .equip .person,
.home .equip .person *{
  box-shadow:none !important;
}

/* responsive tablet */
@media (max-width: 980px){
  .home .equip{
    padding:80px 20px 90px;
  }

  .home .equip .grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:54px 34px;
    max-width:760px;
  }

  .home .equip .person h4{
    font-size:27px;
  }

  .home .equip .person p{
    font-size:15px;
    max-width:220px;
  }
}

/* responsive mòbil */
@media (max-width: 768px){
  .home .millennials{
    padding:20px 16px 6px;
  }

  .home .millennials .title{
    font-size:17px;
    letter-spacing:.06em;
  }

  .home .millennials .title::after{
    width:42px;
    margin-top:12px;
  }

  .home .equip{
    padding:56px 16px 70px;
  }

  .home .equip .grid{
    grid-template-columns:1fr;
    gap:42px;
    max-width:340px;
  }

  .home .equip .person{
    max-width:100%;
  }

  .home .equip .person h4{
    font-size:24px;
    margin-bottom:8px;
  }

  .home .equip .person h4::after{
    width:20px;
    margin-top:10px;
  }

  .home .equip .person p{
    font-size:15px;
    line-height:1.55;
    max-width:260px;
  }
}
/* =========================
   CENTRAR TÍTOL EQUIP
   ========================= */

.home .millennials .title .container{
  text-align:center !important;
}

.home .millennials .title{
  text-align:center !important;
}
/* =========================
   AMAGAR SUPORT A LA HOME
   ========================= */

.home .support{
  display:none !important;
}
/* =========================
   POSICIÓ ICONES XARXES
   ========================= */

.hero-social{
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:28px;

  margin-top:140px;
  margin-bottom:120px;

  opacity:.85;
}

/* mida icones */

.hero-social img{
  width:12px;
  height:auto;
  opacity:.8;
  transition:opacity .25s ease, transform .25s ease;
}

.hero-social a:hover img{
  opacity:1;
  transform:translateY(-2px);
}
/* =========================
   AJUST HERO + VALORS
   ========================= */

.hero-social{
  margin-top:120px !important;
  margin-bottom:50px !important;
}

.values-premium{
  padding:40px 0 90px !important;
  margin-top:0 !important;
}
/* mateix fons que la resta de la home */

.millennials-bottom{
  background:#223545 !important;
}
/* =========================
   FOOTER PREMIUM VIDRE
   ========================= */

.site-above-footer-wrap{
  background:#223545 !important;
  position:relative;
  padding:60px 0 !important;

  /* efecte vidre */
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  background:rgba(34,53,69,0.85) !important;

  /* línia superior subtil */
  border-top:1px solid rgba(255,255,255,0.08);
}

/* treure colors interns del tema */

.site-footer-above-section-1,
.site-footer-above-section-2,
.site-footer-above-section-3{
  background:transparent !important;
}

/* widgets nets */

.site-above-footer-wrap .widget{
  background:transparent !important;
  box-shadow:none !important;
  border:none !important;
}

/* icones socials més premium */

.site-above-footer-wrap .ast-builder-social-element{
  border:1px solid rgba(255,255,255,0.15);
  backdrop-filter: blur(6px);
  transition:all .25s ease;
}

.site-above-footer-wrap .ast-builder-social-element:hover{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,0.35);
}
/* =========================
   FOOTER PREMIUM INTEGRAT
   ========================= */

.footer-premium{

  /* mateix color que el fons */
  background:rgba(34,53,69,0.60);

  backdrop-filter:blur(16px) saturate(130%);
  -webkit-backdrop-filter:blur(16px) saturate(130%);

  border:1px solid rgba(243,176,63,0.25);

  border-radius:28px;

  padding:42px 60px !important;

  /* glow molt més subtil */
  box-shadow:
  0 0 8px rgba(243,176,63,0.10),
  0 0 20px rgba(243,176,63,0.05),
  0 20px 40px rgba(0,0,0,0.35),
  inset 0 1px 0 rgba(255,255,255,0.10);
}
/* =========================
   LIGHT FOLLOW EFFECT
   ========================= */

.footer-premium{
  position:relative;
  overflow:hidden;
}

.footer-premium::before{
  content:"";
  position:absolute;
  inset:-220px;

  background:radial-gradient(
    circle at var(--x,50%) var(--y,50%),
    rgba(243,176,63,0.06),
    transparent 50%
  );

  pointer-events:none;
  transition:opacity .2s ease;
  opacity:.5;
}
/* =========================
   CURSOR LIGHT HOME
   ========================= */

.home .cursor-light-home{
  position:fixed;
  top:0;
  left:0;
  width:100vw;
  height:100vh;
  pointer-events:none;
  z-index:999;
  opacity:1;
  mix-blend-mode:screen;

  background:radial-gradient(
    70px circle at var(--cursor-x, 50vw) var(--cursor-y, 50vh),
    rgba(243,176,63,0.12) 0%,
    rgba(243,176,63,0.06) 30%,
    rgba(243,176,63,0.00) 70%
  );
}

/* perquè el contingut segueixi sent clicable i visible */

.home .site-header,
.home #primary,
.home .site-footer{
  position:relative;
  z-index:1;
}

/* =========================
   CURSOR MILLENNIALS
   ========================= */

.cursor-m{
  position:fixed;
  top:0;
  left:0;
  width:20px;
  height:20px;
  pointer-events:none;
  z-index:99999;
  transform:translate(-50%,-50%);
  background-image:url("http://millennialsturisme.cat/wp-content/uploads/2026/03/cursor.png");
  background-size:contain;
  background-repeat:no-repeat;
  background-position:center;
  transition:transform .18s ease, filter .18s ease;
}

/* amagar cursor del navegador */

body.cursor-m-active,
body.cursor-m-active *{
  cursor:none !important;
}

/* =========================
   EFECTE HOVER CURSOR
   ========================= */

body.cursor-hover .cursor-m{
  transform:translate(-50%,-50%) scale(1.3) rotate(8deg);
  filter:drop-shadow(0 0 6px rgba(243,176,63,0.7));
}
/* compactació real del menú dret del footer */

.footer-right{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  align-items:flex-end !important;
  gap:5px !important;
  min-width:auto !important;
  height:auto !important;
}

.footer-right > *{
  margin:0 !important;
}

.footer-right a{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  line-height:1.15 !important;
  font-size:0.95rem !important;
  text-align:right !important;
  white-space:nowrap;
}

.footer-right a + a{
  margin-top:0 !important;
}

.footer-right p,
.footer-right div{
  margin:0 !important;
  padding:0 !important;
}
.footer-right a{
  color:#ffffff;
  transition:color 0.25s ease, transform 0.25s ease;
}

.footer-right a:hover{
  color:#f3b03f;
  transform:translateX(-3px);
}
/* =========================
   FILTRES PROJECTES PREMIUM
   ========================= */

.projects-filters{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  margin:0 auto 40px auto;
  padding:0;
}

.projects-filter{
  appearance:none;
  -webkit-appearance:none;
  border:1px solid rgba(255,255,255,0.28);
  border-radius:999px;

  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.34);

  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);

  box-shadow:
    0 8px 20px rgba(0,0,0,0.16),
    inset 0 1px 0 rgba(255,255,255,0.18);

  color:rgba(255,255,255,0.92);

  font-family:"Arial Rounded MT";
  font-size:0.9rem;
  line-height:1;

  padding:12px 22px;
  min-height:42px;

  cursor:pointer;

  transition:
    border-color .25s ease,
    background .25s ease,
    color .25s ease,
    transform .25s ease,
    box-shadow .25s ease;
}

.projects-filter:hover{
  border-color:#f3b03f;
  color:#f3b03f;

  background:
    linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.04)),
    rgba(34,53,69,0.44);

  box-shadow:
    0 10px 26px rgba(0,0,0,0.22),
    0 0 10px rgba(243,176,63,0.16);

  transform:translateY(-1px);
}

.projects-filter:focus{
  outline:none;
  border-color:#f3b03f;
  color:#f3b03f;
}

.projects-filter.active{
  border-color:rgba(243,176,63,0.72);
  color:#f3b03f;

  background:
    linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.04)),
    rgba(34,53,69,0.46);

  box-shadow:
    0 12px 30px rgba(0,0,0,0.24),
    0 0 14px rgba(243,176,63,0.18),
    inset 0 1px 0 rgba(255,255,255,0.22);
}

@media (max-width:768px){

  .projects-filters{
    gap:8px;
    margin:0 auto 28px auto;
  }

  .projects-filter{
    font-size:0.85rem;
    padding:10px 18px;
    min-height:38px;
  }

}
/* =========================
   UNIFICAR FONS PÀGINA PROJECTES
   ========================= */

.page-id-103,
.page-id-103 #primary,
.page-id-103 .site-content,
.page-id-103 .entry-content,
.page-id-103 .site-main,
.page-id-103 .top-home,
.page-id-103 .social-cases{
  background:#223545 !important;
  background-image:none !important;
}
/* =========================
   LÍNIA GROGA A PROJECTES
   ========================= */

.page-id-103 .top-home:after{
  background:#f3b03f !important;
  height:2px;
  opacity:0.85;
}
/* =========================
   CORRECCIÓ LÍNIA HEADER PROJECTES
   ========================= */

.page-id-103 a.logo{
  border-bottom:1px solid rgba(243,176,63,0.75) !important;
}

.page-id-103 .top-home{
  border-bottom:none !important;
}

.page-id-103 .site-header,
.page-id-103 #masthead,
.page-id-103 .main-header-bar{
  border-bottom:none !important;
  box-shadow:none !important;
}
/* =========================
   LÍNIA DIFUMINADA PROJECTES
   ========================= */

.page-id-103 a.logo{
  position:relative;
  border-bottom:none !important;
  padding:12px 0;
}

.page-id-103 a.logo:after{
  content:"";
  position:absolute;
  left:0;
  bottom:-1px;
  width:100%;
  height:2px;
opacity:0.4;

  background:linear-gradient(
    90deg,
    rgba(243,176,63,0) 0%,
    rgba(243,176,63,0.7) 50%,
    rgba(243,176,63,0) 100%
  );
}
/* =========================
   LOGO PROJECTES OPTIMITZAT
   ========================= */

.page-id-103 a.logo{
  padding:10px 0;
}

.page-id-103 a.logo img{
  max-width:300px;
  height:auto;
}
/* =========================
   AJUST ESPAI SUPERIOR PROJECTES
   ========================= */

.page-id-103 .social-cases{
  padding:20px 0 60px !important;
}

/* =========================
   CONTACTE HOME PREMIUM
   ========================= */

.home-contact-cta-wrap{
  background:#223545;
  padding:70px 20px 95px;
  display:flex;
  justify-content:center;
  align-items:center;
}

.home-contact-trigger,
.home-contact-submit{
  appearance:none;
  -webkit-appearance:none;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:104px;
  height:46px;
  padding:0 20px;
  border:1px solid rgba(255,255,255,0.35);
  border-radius:999px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.35);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:
    0 8px 20px rgba(0,0,0,0.15),
    inset 0 1px 0 rgba(255,255,255,0.25);
  cursor:pointer;
  outline:none;
  transition:
    border-color .25s ease,
    background .25s ease,
    transform .25s ease,
    box-shadow .25s ease,
    color .25s ease;
}

.home-contact-trigger span,
.home-contact-submit span{
  color:#ffffff;
  font-family:"Arial Rounded MT";
  font-size:14px;
  line-height:1;
  letter-spacing:.08em;
  text-transform:uppercase;
  transition:color .25s ease;
}

.home-contact-trigger:hover,
.home-contact-trigger:focus,
.home-contact-submit:hover,
.home-contact-submit:focus{
  border-color:#f3b03f;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.04)),
    rgba(34,53,69,0.45);
  box-shadow:
    0 10px 26px rgba(0,0,0,0.22),
    0 0 10px rgba(243,176,63,0.25);
  transform:translateY(-1px);
}

.home-contact-trigger:hover span,
.home-contact-trigger:focus span,
.home-contact-submit:hover span,
.home-contact-submit:focus span{
  color:#f3b03f;
}

.home-contact-modal{
  position:fixed;
  inset:0;
  z-index:999999;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .3s ease, visibility .3s ease;
}

.home-contact-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.home-contact-overlay{
  position:absolute;
  inset:0;
  background:rgba(20,30,40,0.34);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

.home-contact-panel{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  width:min(560px, calc(100vw - 32px));
  border-radius:28px;
  border:1px solid rgba(243,176,63,0.45);
  background:
    linear-gradient(145deg, rgba(255,255,255,0.10), rgba(255,255,255,0.03)),
    linear-gradient(180deg, rgba(34,53,69,0.60), rgba(34,53,69,0.42));
  backdrop-filter:blur(28px) saturate(160%);
  -webkit-backdrop-filter:blur(28px) saturate(160%);
  box-shadow:
    0 30px 80px rgba(0,0,0,0.35),
    0 0 18px rgba(243,176,63,0.18),
    inset 0 1px 0 rgba(255,255,255,0.18);
  overflow:hidden;
}

.home-contact-panel::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 20% 10%, rgba(255,255,255,0.16), transparent 40%);
  opacity:.55;
  pointer-events:none;
}

.home-contact-panel-inner{
  position:relative;
  z-index:2;
  padding:44px 34px 34px;
}

.home-contact-close{
  position:absolute;
  top:18px;
  right:18px;
  z-index:3;
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,0.18);
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  color:#ffffff;
  font-size:24px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:all .25s ease;
}

.home-contact-close:hover{
  color:#f3b03f;
  border-color:#f3b03f;
  background:rgba(255,255,255,0.08);
  box-shadow:0 0 10px rgba(243,176,63,0.22);
}

.home-contact-panel h3{
  margin:0 0 26px;
  color:#ffffff;
  font-family:"Arial Rounded MT";
  font-size:2rem;
  line-height:1.05;
  text-align:left;
}

.home-contact-form{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.home-contact-field{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.home-contact-field label{
  color:rgba(255,255,255,0.78);
  font-size:0.95rem;
  line-height:1.2;
}

.home-contact-field input,
.home-contact-field textarea{
  width:100%;
  border:1px solid rgba(255,255,255,0.14);
  border-radius:18px;
  background:rgba(255,255,255,0.06);
  color:#ffffff;
  font-family:"Varela Round", sans-serif;
  font-size:1rem;
  line-height:1.5;
  padding:16px 18px;
  outline:none;
  box-shadow:none;
  transition:border-color .25s ease, background .25s ease, box-shadow .25s ease;
}

.home-contact-field input:focus,
.home-contact-field textarea:focus{
  border-color:rgba(243,176,63,0.55);
  background:rgba(255,255,255,0.08);
  box-shadow:0 0 0 3px rgba(243,176,63,0.08);
}

.home-contact-field textarea{
  min-height:150px;
  resize:vertical;
}

.home-contact-submit{
  margin-top:6px;
  align-self:flex-start;
}

body.home-contact-open{
  overflow:hidden;
}

@media (max-width:768px){
  .home-contact-cta-wrap{
    padding:50px 16px 70px;
  }

  .home-contact-panel-inner{
    padding:34px 22px 24px;
  }

  .home-contact-panel h3{
    font-size:1.7rem;
    margin-bottom:22px;
  }

  .home-contact-trigger,
  .home-contact-submit{
    min-width:96px;
    height:42px;
    padding:0 18px;
  }

  .home-contact-trigger span,
  .home-contact-submit span{
    font-size:13px;
  }
}
/* COLOR TEXT FORMULARI CONTACTE */

.home-contact-form input,
.home-contact-form textarea{
  color:#ffffff !important;
  opacity:1 !important;
}

/* camp email específic */
.home-contact-form input[type="email"]{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  opacity:1 !important;
}

/* quan escrius */
.home-contact-form input[type="email"]:focus,
.home-contact-form textarea:focus{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}

/* autofill Chrome / Safari */
.home-contact-form input[type="email"]:-webkit-autofill,
.home-contact-form input[type="email"]:-webkit-autofill:hover,
.home-contact-form input[type="email"]:-webkit-autofill:focus{
  -webkit-text-fill-color:#ffffff !important;
  transition: background-color 9999s ease-in-out 0s;
  box-shadow:0 0 0px 1000px transparent inset !important;
}
.home-contact-feedback{
  margin:14px 0 0;
  font-size:15px;
  line-height:1.4;
  min-height:22px;
  color:rgba(255,255,255,0.72);
}

.home-contact-feedback.is-success{
  color:#f3b03f;
}

.home-contact-feedback.is-error{
  color:#ff8f8f;
}

.home-contact-submit:disabled{
  opacity:.65;
  cursor:wait;
}
.hero-contact{
  position:absolute;
  top:54px;
  left:60px;
  z-index:40;
}

.hero-contact .home-contact-trigger{
  transform:scale(0.72);
  transform-origin:left center;
  backdrop-filter:blur(6px);
  box-shadow:0 6px 18px rgba(0,0,0,0.15);
  transition:all .25s ease;
}

.hero-contact .home-contact-trigger:hover,
.hero-contact .home-contact-trigger:focus,
.hero-contact .home-contact-trigger:focus-visible,
.hero-contact .home-contact-trigger:active{
  transform:scale(0.72) translateY(-2px);
  box-shadow:0 10px 28px rgba(0,0,0,0.22);
}
.hero-contact .home-contact-trigger span{
  letter-spacing:.08em;
}
.hero-contact .home-contact-trigger span{
  font-size:12px;
  letter-spacing:.12em;
}

.hero-contact .home-contact-trigger{
  padding:12px 22px;
}
.home-contact-cta-wrap .home-contact-trigger{
  transform:none !important;
  padding:20px 42px !important;
}

.home-contact-cta-wrap .home-contact-trigger{
  padding:20px 46px !important;
  border-width:1.5px;
}

.home-contact-cta-wrap .home-contact-trigger span{
  font-size:11px !important;
  letter-spacing:.18em;
}
}

@media (max-width: 768px){
  .hero-contact{
    top:20px;
    left:18px;
  }
}
/* =========================
   CURSOR PER DAMUNT DEL MENÚ
   ========================= */

.cursor-m{
  z-index:1000001 !important;
}
/* =========================
   SUBMENÚ MENU ULTRA SUAU
   ========================= */

.mm-menu-item-collapsible{
  transition:padding .65s cubic-bezier(.16,.84,.44,1);
}

.mm-menu-submenu{
  display:block;
  max-height:0;
  opacity:0;
  overflow:hidden;
  transform:translateY(-3px);
  margin-top:0;
  transition:
    max-height 1.05s cubic-bezier(.16,.84,.44,1),
    opacity .55s ease,
    transform .55s ease,
    margin-top .65s cubic-bezier(.16,.84,.44,1);
  will-change:max-height, opacity, transform;
}

.mm-menu-item-collapsible.is-open .mm-menu-submenu{
  max-height:260px;
  opacity:1;
  transform:translateY(0);
  margin-top:10px;
}
/* =========================
   VIDRE FONS CONTACTE SUAU
   ========================= */

.home-contact-overlay{
  position:absolute;
  inset:0;
  background:rgba(20,30,40,0.35);
  backdrop-filter:blur(10px);
  opacity:0;
  transition:opacity .6s cubic-bezier(.22,.61,.36,1);
}

.home-contact-modal.is-open .home-contact-overlay{
  opacity:1;
}

/* =========================
   CONTACTE · MATEIX MODEL DEL HERO
   però robust en totes les pantalles
   ========================= */

.home-contact-modal{
  position:fixed;
  inset:0;
  z-index:999999;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:20px !important;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .3s ease, visibility .3s ease;
}

.home-contact-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.home-contact-overlay{
  position:absolute;
  inset:0;
  background:rgba(20,30,40,0.34);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  opacity:1 !important;
}

.home-contact-panel{
  position:relative !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  transform:none !important;

  width:min(560px, calc(100vw - 32px)) !important;
  max-height:calc(100dvh - 40px) !important;

  border-radius:28px;
  overflow:hidden !important;

  display:flex !important;
  flex-direction:column !important;
  z-index:2 !important;
}

.home-contact-panel-inner{
  position:relative;
  z-index:2;
  padding:44px 34px 34px;
  overflow-y:auto !important;
  max-height:calc(100dvh - 40px) !important;
  -webkit-overflow-scrolling:touch;
}

/* desktop baixet */
@media (max-height:760px){
  .home-contact-panel{
    max-height:calc(100dvh - 24px) !important;
  }

  .home-contact-panel-inner{
    max-height:calc(100dvh - 24px) !important;
    padding:34px 28px 26px !important;
  }

  .home-contact-field textarea{
    min-height:120px !important;
  }
}

/* mòbil: mateix efecte blur, però panell millor encaixat */
@media (max-width:768px){

  .home-contact-modal{
    padding:14px !important;
    align-items:center !important;
    justify-content:center !important;
  }

  .home-contact-panel{
    width:min(560px, calc(100vw - 28px)) !important;
    max-height:calc(100dvh - 28px) !important;
    border-radius:24px !important;
  }

  .home-contact-panel-inner{
    max-height:calc(100dvh - 28px) !important;
    padding:30px 20px 22px !important;
  }

  .home-contact-panel h3{
    font-size:1.55rem !important;
    margin:0 0 18px !important;
    padding-right:54px !important;
  }

  .home-contact-close{
    top:14px !important;
    right:14px !important;
    width:40px !important;
    height:40px !important;
  }

  .home-contact-field input,
  .home-contact-field textarea{
    padding:14px 16px !important;
  }

  .home-contact-field textarea{
    min-height:110px !important;
  }
}

/* pantalles molt baixes */
@media (max-width:768px) and (max-height:700px){

  .home-contact-modal{
    padding:10px !important;
  }

  .home-contact-panel{
    max-height:calc(100dvh - 20px) !important;
  }

  .home-contact-panel-inner{
    max-height:calc(100dvh - 20px) !important;
    padding:24px 18px 18px !important;
  }

  .home-contact-panel h3{
    font-size:1.4rem !important;
    margin-bottom:14px !important;
  }

  .home-contact-field{
    gap:6px !important;
  }

  .home-contact-form{
    gap:14px !important;
  }

  .home-contact-field textarea{
    min-height:90px !important;
  }

  .home-contact-submit{
    margin-top:4px !important;
  }
}
/* =========================
   CONTACTE · CAPES DEFINITIVES
   modal per damunt de tot
   footer sempre al darrere
   ========================= */

.home-contact-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:9999999 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:20px !important;
}

.home-contact-overlay{
  position:fixed !important;
  inset:0 !important;
  z-index:1 !important;
  background:rgba(20,30,40,0.34) !important;
  backdrop-filter:blur(10px) !important;
  -webkit-backdrop-filter:blur(10px) !important;
}

.home-contact-panel{
  position:relative !important;
  z-index:2 !important;
}

/* assegurar que cap bloc de la home ni el footer superin el modal */
.footer-premium,
footer,
.site-footer,
.home-contact-cta-wrap{
  position:relative;
  z-index:auto !important;
}
/* CONTACTE sempre per damunt del menú */
.home-contact-modal{
  z-index:99999999 !important;
}

.mm-premium-menu,
.mm-premium-panel{
  z-index:9999990 !important;
}
/* =========================
   MILLENNIALS PRO · PÀGINA 29
   ========================= */

.page-id-29,
.page-id-29 .site,
.page-id-29 .site-content,
.page-id-29 .ast-container,
.page-id-29 #primary,
.page-id-29 .site-main,
.page-id-29 .entry-content,
.page-id-29 main,
.page-id-29 .top-home,
.page-id-29 .destacats,
.page-id-29 .top-social,
.page-id-29 .site-header,
.page-id-29 #masthead,
.page-id-29 .main-header-bar,
.page-id-29 .ast-builder-grid-row-container,
.page-id-29 .ast-builder-row,
.page-id-29 .site-primary-header-wrap,
.page-id-29 .ast-primary-header-bar{
  background:#223545 !important;
  background-image:none !important;
  border:none !important;
  box-shadow:none !important;
}

/* treure qualsevol línia antiga del header */
.page-id-29 #masthead,
.page-id-29 .site-header,
.page-id-29 .main-header-bar,
.page-id-29 .top-social,
.page-id-29 .top-home{
  border-top:none !important;
  box-shadow:none !important;
}

/* logo més petit només a la 29 */
.page-id-29 a.logo img{
  max-width:260px !important;
  width:100%;
  height:auto;
  padding:10px 0 !important;
}

/* treure la línia antiga del logo */
.page-id-29 a.logo{
  border-bottom:none !important;
  padding:10px 0 18px !important;
  position:relative;
}

/* línia premium vermella sota el logo */
.page-id-29 a.logo::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  height:2px;
  opacity:.55;
  background:linear-gradient(
    90deg,
    rgba(227,101,120,0) 0%,
    rgba(227,101,120,.82) 50%,
    rgba(227,101,120,0) 100%
  );
}

/* claim més petit */
.page-id-29 .top-home .container{
  max-width:900px !important;
}

.page-id-29 .top-home p{
  font-size:20px !important;
  line-height:1.6 !important;
  max-width:760px !important;
  margin:0 auto !important;
  padding:26px 0 30px !important;
}

/* si hi ha un h2 a la capçalera */
.page-id-29 .top-home h2{
  margin-bottom:6px !important;
}
.page-id-29 .destacats{
padding-top:0 !important;
margin-top:-70px !important;
}
.page-id-29 .top-home p{
margin-top:18px !important;
}

/* =========================
   FRANJA SUPERIOR VERMELLA PRO
   ========================= */

.page-id-29 .top-social{
background:#e26578 !important;
height:28px !important;
min-height:28px !important;
padding:0 !important;
}
/* =========================
   FRANJA SUPERIOR VERMELLA PRO
   ========================= */

.page-id-29 .top-social{
background:#e26578 !important;
height:28px !important;
min-height:28px !important;
padding:0 !important;
}
/* =========================
HEADER UNIFICAT PROJECTES I PRO
========================= */

.page-id-129 .top-home,
.page-id-29 .top-home{
max-width:1100px;
margin:0 auto;
text-align:center;
}

/* mateixa mida de logo */

.page-id-129 a.logo img,
.page-id-29 a.logo img{
max-width:260px !important;
height:auto;
}

/* mateix espai vertical */

.page-id-129 a.logo,
.page-id-29 a.logo{
padding:18px 0 18px !important;
}

/* mateixa alçada visual del header */

.page-id-129 .top-home,
.page-id-29 .top-home{
padding-top:40px;
}
/* =========================
HEADER IDÈNTIC PROJECTES I PRO
========================= */

.page-id-129 .top-home,
.page-id-29 .top-home{
  max-width:none !important;
  width:100% !important;
  margin:0 !important;
  padding-top:40px !important;
  text-align:center;
}

.page-id-129 .top-home > .logo,
.page-id-29 .top-home > .logo{
  display:block;
  width:100%;
  max-width:1100px;
  margin:0 auto;
  padding:18px 0 18px !important;
  text-align:center;
}

.page-id-129 a.logo img,
.page-id-29 a.logo img{
  display:block;
  width:100%;
  max-width:260px !important;
  height:auto !important;
  margin:0 auto !important;
}
/* logo més gran a Pro per igualar Projectes */

.page-id-29 a.logo img{
max-width:340px !important;
height:auto;
}
.page-id-29 a.logo::after{
bottom:-20px;
}
.home .top-social{
  display:none !important;
}
/* =========================
   COOKIES PREMIUM
   ========================= */

/* amagar només el botó flotant de gestionar consentiment */
#cmplz-manage-consent{
display:none !important;
}

/* contenidor / modal */
.cmplz-cookiebanner{
  background:
    linear-gradient(145deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.88) !important;
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);

  border:1px solid rgba(243,176,63,0.35) !important;
  border-radius:32px !important;

  box-shadow:
    0 24px 70px rgba(0,0,0,0.35),
    0 0 18px rgba(243,176,63,0.10),
    inset 0 1px 0 rgba(255,255,255,0.10) !important;

  color:#ffffff !important;
  overflow:hidden !important;
}

/* títol */
.cmplz-cookiebanner .cmplz-title{
  color:#ffffff !important;
  font-family:"Arial Rounded MT", sans-serif !important;
  font-size:2rem !important;
  line-height:1.1 !important;
  text-align:center !important;
  margin-bottom:22px !important;
}

/* text */
.cmplz-cookiebanner .cmplz-message,
.cmplz-cookiebanner .cmplz-message p{
  color:rgba(255,255,255,0.82) !important;
  font-family:"Varela Round", sans-serif !important;
  font-size:1rem !important;
  line-height:1.7 !important;
}

/* botons base */
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn{
  min-height:54px !important;
  padding:0 26px !important;
  border-radius:24px !important;
  border:1px solid rgba(255,255,255,0.16) !important;

  background:
    linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02)),
    rgba(255,255,255,0.04) !important;

  color:#ffffff !important;
  font-family:"Arial Rounded MT", sans-serif !important;
  font-size:1rem !important;
  letter-spacing:.01em !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.10),
    0 8px 20px rgba(0,0,0,0.10) !important;

  transition:
    border-color .25s ease,
    background .25s ease,
    transform .25s ease,
    box-shadow .25s ease !important;
}

/* hover general */
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(243,176,63,0.45) !important;
  box-shadow:
    0 10px 24px rgba(0,0,0,0.16),
    0 0 10px rgba(243,176,63,0.10) !important;
}

/* accepta */
.cmplz-cookiebanner .cmplz-btn.cmplz-accept{
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.02)),
    #6ea89c !important;
  border-color:rgba(255,255,255,0.12) !important;
  color:#ffffff !important;
}

/* denega i preferències */
.cmplz-cookiebanner .cmplz-btn.cmplz-deny,
.cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences{
  background:
    linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02)),
    rgba(255,255,255,0.04) !important;
  color:#ffffff !important;
}

/* enllaços inferiors */
.cmplz-cookiebanner a,
.cmplz-cookiebanner .cmplz-links a{
  color:#f3b03f !important;
  text-decoration:none !important;
  transition:opacity .25s ease !important;
}

.cmplz-cookiebanner a:hover,
.cmplz-cookiebanner .cmplz-links a:hover{
  opacity:.8 !important;
}

/* botó tancar refinat */
.cmplz-close,
button.cmplz-close{
  width:32px !important;
  height:32px !important;
  min-width:32px !important;
  min-height:32px !important;
  padding:0 !important;

  border-radius:50% !important;
  border:1px solid rgba(255,255,255,0.15) !important;
  background:rgba(255,255,255,0.05) !important;

  color:#ffffff !important;
  font-size:16px !important;
  line-height:1 !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  box-shadow:none !important;

  transition:
    border-color .25s ease,
    background .25s ease,
    transform .25s ease,
    box-shadow .25s ease !important;
}

.cmplz-close:hover,
button.cmplz-close:hover{
  border-color:#f3b03f !important;
  background:rgba(255,255,255,0.08) !important;
  transform:scale(1.05) !important;
  box-shadow:0 0 8px rgba(243,176,63,0.18) !important;
}

/* si surt la icona en svg o pseudo-element */
.cmplz-close svg,
.cmplz-close:before,
button.cmplz-close svg,
button.cmplz-close:before{
  width:14px !important;
  height:14px !important;
  font-size:14px !important;
}

/* responsive */
@media (max-width: 768px){
  .cmplz-cookiebanner{
    border-radius:26px !important;
    padding:18px !important;
  }

  .cmplz-cookiebanner .cmplz-title{
    font-size:1.55rem !important;
    margin-bottom:16px !important;
  }

  .cmplz-cookiebanner .cmplz-message,
  .cmplz-cookiebanner .cmplz-message p{
    font-size:.95rem !important;
    line-height:1.6 !important;
  }

  .cmplz-cookiebanner .cmplz-buttons{
    gap:10px !important;
  }

  .cmplz-cookiebanner .cmplz-buttons .cmplz-btn{
    width:100% !important;
    min-height:48px !important;
    font-size:.95rem !important;
  }
}
/* =========================
   PÀGINA 376 · PORTFOLI AUDIOVISUAL
   BASE NETA
   ========================= */

.page-id-376 .audiovisual-page{
  padding: 70px 0 90px;
  background: #223545;
}

.page-id-376 .audiovisual-header{
  text-align: center;
  max-width: 760px;
  margin: 0 auto 34px;
}

.page-id-376 .audiovisual-header h1{
  color: #ffffff;
  font-family: "Arial Rounded MT";
  font-size: 2.8rem;
  line-height: 1.08;
  margin: 0 0 10px;
}

.page-id-376 .audiovisual-header p{
  color: rgba(255,255,255,0.78);
  font-size: 1.05rem;
  line-height: 1.6;
  margin: 0;
}

.page-id-376 .audiovisual-nav{
  display: flex;
  justify-content: center;
  gap: 12px;
  margin: 0 0 34px;
  flex-wrap: wrap;
}

.page-id-376 .audiovisual-tab{
  appearance: none;
  border: 1px solid rgba(255,255,255,0.18);
  background: transparent;
  color: rgba(255,255,255,0.82);
  border-radius: 999px;
  padding: 11px 18px;
  cursor: pointer;
  font-family: "Varela Round", sans-serif;
  transition: all .25s ease;
}

.page-id-376 .audiovisual-tab.active,
.page-id-376 .audiovisual-tab:hover{
  border-color: #f3b03f;
  color: #f3b03f;
}

.page-id-376 .audiovisual-panel{
  display: none;
}

.page-id-376 .audiovisual-panel.active{
  display: block;
}

.page-id-376 .audiovisual-grid{
  display: grid;
  gap: 28px;
}

.page-id-376 .audiovisual-grid-video{
  grid-template-columns: 1fr;
}

.page-id-376 .audiovisual-grid-reels{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.page-id-376 .audiovisual-grid-photos{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.page-id-376 .audiovisual-card{
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 24px;
  overflow: hidden;
}

.page-id-376 .audiovisual-media{
  background: #16242f;
}

.page-id-376 .audiovisual-media video,
.page-id-376 .audiovisual-media img{
  width: 100%;
  display: block;
}

.page-id-376 .audiovisual-media-video video{
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.page-id-376 .audiovisual-media-reel{
  max-width: 320px;
  margin: 0 auto;
  padding: 14px;
}

.page-id-376 .audiovisual-media-reel video{
  aspect-ratio: 9 / 16;
  object-fit: cover;
  border-radius: 18px;
}

.page-id-376 .audiovisual-media-photo img{
  aspect-ratio: 4 / 5;
  object-fit: cover;
}

.page-id-376 .audiovisual-copy{
  padding: 18px 18px 20px;
}

.page-id-376 .audiovisual-copy h2{
  color: #ffffff;
  font-family: "Arial Rounded MT";
  font-size: 1.2rem;
  line-height: 1.15;
  margin: 0 0 8px;
}

.page-id-376 .audiovisual-copy p{
  color: rgba(255,255,255,0.74);
  font-size: 0.95rem;
  line-height: 1.55;
  margin: 0;
}

@media (max-width: 980px){
  .page-id-376 .audiovisual-grid-reels,
  .page-id-376 .audiovisual-grid-photos{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px){
  .page-id-376 .audiovisual-page{
    padding: 46px 0 64px;
  }

  .page-id-376 .audiovisual-header{
    margin-bottom: 26px;
  }

  .page-id-376 .audiovisual-header h1{
    font-size: 2rem;
  }

  .page-id-376 .audiovisual-header p{
    font-size: 0.96rem;
  }

  .page-id-376 .audiovisual-nav{
    gap: 10px;
    margin-bottom: 24px;
  }

  .page-id-376 .audiovisual-tab{
    font-size: 0.92rem;
    padding: 10px 15px;
  }

  .page-id-376 .audiovisual-grid-reels,
  .page-id-376 .audiovisual-grid-photos{
    grid-template-columns: 1fr;
  }

  .page-id-376 .audiovisual-copy h2{
    font-size: 1.05rem;
  }

  .page-id-376 .audiovisual-copy p{
    font-size: 0.9rem;
  }
}
/* =========================
   PORTFOLI AUDIOVISUAL 376
   ========================= */

.portfolio-audiovisual-page{
  padding:80px 0 110px;
}

.portfolio-audiovisual-header{
  text-align:center;
  margin:0 0 34px;
}

.portfolio-audiovisual-header h1{
  margin:0 0 10px;
  font-size:clamp(34px, 4vw, 56px);
  line-height:1.04;
}

.portfolio-audiovisual-header p{
  margin:0;
  font-size:1.05rem;
  opacity:.78;
}

.portfolio-audiovisual-nav{
  display:flex;
  justify-content:center;
  gap:12px;
  margin:0 0 34px;
  flex-wrap:wrap;
}

.portfolio-tab{
  border:1px solid rgba(255,255,255,.18);
  background:transparent;
  color:inherit;
  border-radius:999px;
  padding:12px 20px;
  cursor:pointer;
  transition:.25s ease;
}

.portfolio-tab.is-active,
.portfolio-tab:hover{
  border-color:#f3b03f;
  color:#f3b03f;
}

.portfolio-panel{
  display:none;
}

.portfolio-panel.is-active{
  display:block;
}

.portfolio-video-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:28px;
}

.portfolio-video-card{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:28px;
  overflow:hidden;
}

.portfolio-video-media video{
  width:100%;
  display:block;
  aspect-ratio:16 / 9;
  object-fit:cover;
  background:#000;
}

.portfolio-video-meta{
  padding:18px 18px 20px;
}

.portfolio-video-meta h2{
  margin:0 0 8px;
  font-size:1.35rem;
  line-height:1.08;
}

.portfolio-video-meta p{
  margin:0;
  opacity:.78;
}

.portfolio-reels-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:28px;
}

.portfolio-reel-card{
  text-align:center;
}

.portfolio-reel-phone{
  width:min(100%, 260px);
  margin:0 auto 18px;
  background:#111820;
  padding:10px;
  border-radius:34px;
  box-shadow:0 24px 60px rgba(0,0,0,.22);
}

.portfolio-reel-phone video{
  width:100%;
  display:block;
  aspect-ratio:9 / 16;
  object-fit:cover;
  border-radius:24px;
  background:#000;
}

.portfolio-reel-meta h2{
  margin:0 0 8px;
  font-size:1.2rem;
  line-height:1.08;
}

.portfolio-reel-meta p{
  margin:0;
  opacity:.78;
}

.portfolio-albums-wrap{
  display:flex;
  flex-direction:column;
  gap:50px;
}

.portfolio-album-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin:0 0 18px;
  flex-wrap:wrap;
}

.portfolio-album-head h2{
  margin:0;
  font-size:1.7rem;
}

.portfolio-album-type{
  display:inline-flex;
  align-items:center;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  padding:8px 14px;
  font-size:.88rem;
  opacity:.8;
}

.portfolio-album-gallery{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
}

.portfolio-photo-item{
  display:block;
  border-radius:22px;
  overflow:hidden;
  background:rgba(255,255,255,.03);
}

.portfolio-photo-item img{
  width:100%;
  display:block;
  aspect-ratio:4 / 3;
  object-fit:cover;
  transition:transform .35s ease;
}

.portfolio-photo-item:hover img{
  transform:scale(1.03);
}

.portfolio-empty{
  text-align:center;
  opacity:.7;
}

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

  .portfolio-reels-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .portfolio-album-gallery{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px){
  .portfolio-audiovisual-page{
    padding:56px 0 80px;
  }

  .portfolio-reels-grid,
  .portfolio-album-gallery{
    grid-template-columns:1fr;
  }

  .portfolio-audiovisual-header h1{
    font-size:2.2rem;
  }
}
.portfolio-video-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
  gap:40px;
  max-width:900px;
  margin:0 auto;
}

.portfolio-video-card video{
  width:100%;
  height:auto;
  border-radius:16px;
  display:block;
}
.portfolio-reel-phone video{
  width:100%;
  max-width:320px;
  aspect-ratio:9/16;
  object-fit:cover;
  border-radius:24px;
  display:block;
  margin:0 auto;
}
.portfolio-video-card{
  text-align:center;
}

.portfolio-video-meta h2{
  margin-top:12px;
  font-size:18px;
}
.portfolio-reels-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:40px;
  max-width:900px;
  margin:0 auto;
}

.portfolio-reel-card{
  text-align:center;
}

.portfolio-reel-phone video{
  width:100%;
  aspect-ratio:9/16;
  object-fit:cover;
  border-radius:24px;
  background:#000;
}
/* FILA HORITZONTAL */
.portfolio-reels-row{
  display:flex;
  gap:20px;
  overflow-x:auto;
  padding:20px 10px;
  scroll-snap-type:x mandatory;
}

.portfolio-reels-row::-webkit-scrollbar{
  display:none;
}

/* ITEM */
.reel-item{
  position:relative;
  min-width:240px;
  height:420px;
  border-radius:20px;
  overflow:hidden;
  flex-shrink:0;
  scroll-snap-align:start;
  background:#000;
  transition:transform 0.4s ease, box-shadow 0.4s ease;
}

/* VIDEO */
.reel-media video{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform 0.5s ease;
}

/* OVERLAY */
.reel-overlay{
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  padding:16px;
  background:linear-gradient(to top, rgba(0,0,0,0.7), transparent);
}

.reel-overlay h3{
  color:#fff;
  font-size:14px;
  margin:0;
  opacity:0.9;
}

/* HOVER EFECTE */
.reel-item:hover{
  transform:scale(1.06);
  z-index:2;
  box-shadow:0 20px 40px rgba(0,0,0,0.4);
}

.reel-item:hover video{
  transform:scale(1.08);
}
/* =========================
   PÀGINA 376 · BASE PREMIUM
   ========================= */

.page-id-376,
.page-id-376 .site,
.page-id-376 .site-content,
.page-id-376 #primary,
.page-id-376 .site-main,
.page-id-376 .entry-content,
.page-id-376 .top-home,
.page-id-376 .portfolio-audiovisual-page{
  background:#223545 !important;
  background-image:none !important;
}

.page-id-376 .top-home{
  padding-top:34px !important;
  padding-bottom:16px !important;
}

.page-id-376 a.logo{
  border-bottom:none !important;
  padding:10px 0 18px !important;
  position:relative;
}

.page-id-376 a.logo::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  height:2px;
  opacity:.38;
  background:linear-gradient(
    90deg,
    rgba(243,176,63,0) 0%,
    rgba(243,176,63,.72) 50%,
    rgba(243,176,63,0) 100%
  );
}

.page-id-376 a.logo img{
  max-width:300px !important;
  height:auto;
}

.page-id-376 .portfolio-audiovisual-page{
  padding:54px 0 110px !important;
}

.page-id-376 .portfolio-audiovisual-header{
  max-width:920px;
  margin:0 auto 34px;
  text-align:center;
}

.page-id-376 .portfolio-audiovisual-header h1{
  margin:0 0 12px;
  color:#ffffff;
  font-family:"Arial Rounded MT";
  font-size:clamp(2.5rem, 4vw, 4.1rem);
  line-height:1.02;
  letter-spacing:-0.02em;
}

.page-id-376 .portfolio-audiovisual-header p{
  margin:0 auto;
  max-width:760px;
  color:rgba(255,255,255,0.76);
  font-size:1.02rem;
  line-height:1.65;
}

.page-id-376 .portfolio-audiovisual-nav{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin:0 auto 38px;
}

.page-id-376 .portfolio-tab{
  appearance:none;
  -webkit-appearance:none;
  border:1px solid rgba(255,255,255,0.22);
  border-radius:999px;
  padding:12px 22px;
  min-height:44px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.34);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:
    0 8px 20px rgba(0,0,0,0.16),
    inset 0 1px 0 rgba(255,255,255,0.16);
  color:rgba(255,255,255,0.88);
  font-family:"Arial Rounded MT";
  font-size:.95rem;
  line-height:1;
  cursor:pointer;
  transition:
    border-color .25s ease,
    background .25s ease,
    box-shadow .25s ease,
    color .25s ease,
    transform .25s ease;
}

.page-id-376 .portfolio-tab:hover{
  border-color:#f3b03f;
  color:#f3b03f;
  transform:translateY(-1px);
  box-shadow:
    0 10px 24px rgba(0,0,0,0.20),
    0 0 12px rgba(243,176,63,0.12);
}

.page-id-376 .portfolio-tab.is-active{
  border-color:rgba(243,176,63,0.72);
  color:#f3b03f;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.04)),
    rgba(34,53,69,0.44);
  box-shadow:
    0 12px 28px rgba(0,0,0,0.24),
    0 0 14px rgba(243,176,63,0.16),
    inset 0 1px 0 rgba(255,255,255,0.18);
}

.page-id-376 .portfolio-panel{
  display:none;
}

.page-id-376 .portfolio-panel.is-active{
  display:block;
  animation:portfolioFade376 .45s ease;
}

@keyframes portfolioFade376{
  from{
    opacity:0;
    transform:translateY(12px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

.page-id-376 .portfolio-video-grid,
.page-id-376 .portfolio-reels-grid,
.page-id-376 .portfolio-albums-wrap{
  max-width:1120px;
  margin:0 auto;
}

.page-id-376 .portfolio-video-card,
.page-id-376 .portfolio-reel-card,
.page-id-376 .portfolio-album{
  position:relative;
}

.page-id-376 .portfolio-video-card{
  background:
    linear-gradient(145deg, rgba(255,255,255,0.07), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.30);
  border:1px solid rgba(243,176,63,0.22);
  border-radius:30px;
  overflow:hidden;
  backdrop-filter:blur(12px) saturate(135%);
  -webkit-backdrop-filter:blur(12px) saturate(135%);
  box-shadow:
    0 20px 55px rgba(0,0,0,0.22),
    0 0 18px rgba(243,176,63,0.08),
    inset 0 1px 0 rgba(255,255,255,0.10);
  transition:
    transform .3s ease,
    box-shadow .3s ease,
    border-color .3s ease;
}

.page-id-376 .portfolio-video-card:hover{
  transform:translateY(-4px);
  border-color:rgba(243,176,63,0.46);
  box-shadow:
    0 28px 70px rgba(0,0,0,0.30),
    0 0 24px rgba(243,176,63,0.14),
    inset 0 1px 0 rgba(255,255,255,0.12);
}

.page-id-376 .portfolio-video-media{
  position:relative;
  background:#111820;
}

.page-id-376 .portfolio-video-media::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:42%;
  pointer-events:none;
  background:linear-gradient(to top, rgba(0,0,0,.34), rgba(0,0,0,0));
}

.page-id-376 .portfolio-video-media video{
  width:100%;
  display:block;
  aspect-ratio:16 / 9;
  object-fit:cover;
  background:#000;
}

.page-id-376 .portfolio-video-meta{
  padding:20px 22px 24px;
}

.page-id-376 .portfolio-video-meta h2{
  margin:0 0 8px;
  color:#ffffff;
  font-family:"Arial Rounded MT";
  font-size:1.3rem;
  line-height:1.08;
}

.page-id-376 .portfolio-video-meta p{
  margin:0;
  color:rgba(255,255,255,0.74);
  font-size:.96rem;
  line-height:1.6;
}

.page-id-376 .portfolio-reels-row{
  display:flex;
  gap:22px;
  overflow-x:auto;
  padding:10px 6px 18px;
  scroll-snap-type:x mandatory;
}

.page-id-376 .portfolio-reels-row::-webkit-scrollbar{
  display:none;
}

.page-id-376 .reel-item{
  position:relative;
  min-width:250px;
  height:440px;
  flex-shrink:0;
  scroll-snap-align:start;
  border-radius:26px;
  overflow:hidden;
  background:
    linear-gradient(145deg, rgba(255,255,255,0.07), rgba(255,255,255,0.02)),
    rgba(17,24,32,0.92);
  border:1px solid rgba(243,176,63,0.20);
  box-shadow:
    0 20px 50px rgba(0,0,0,0.22),
    0 0 16px rgba(243,176,63,0.06);
  transition:
    transform .3s ease,
    border-color .3s ease,
    box-shadow .3s ease;
}

.page-id-376 .reel-item:hover{
  transform:translateY(-4px);
  border-color:rgba(243,176,63,0.42);
  box-shadow:
    0 28px 70px rgba(0,0,0,0.30),
    0 0 20px rgba(243,176,63,0.12);
}

.page-id-376 .reel-media{
  width:100%;
  height:100%;
}

.page-id-376 .reel-media video{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.page-id-376 .reel-overlay{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:18px 16px;
  background:linear-gradient(to top, rgba(0,0,0,.72), rgba(0,0,0,0));
}

.page-id-376 .reel-overlay h3{
  margin:0;
  color:#ffffff;
  font-size:14px;
  line-height:1.35;
  font-family:"Varela Round";
}

.page-id-376 .portfolio-albums-wrap{
  display:flex;
  flex-direction:column;
  gap:52px;
}

.page-id-376 .portfolio-album-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  margin:0 0 18px;
}

.page-id-376 .portfolio-album-head h2{
  margin:0;
  color:#ffffff;
  font-family:"Arial Rounded MT";
  font-size:1.7rem;
  line-height:1.08;
}

.page-id-376 .portfolio-album-type{
  display:inline-flex;
  align-items:center;
  border:1px solid rgba(255,255,255,0.12);
  border-radius:999px;
  padding:8px 14px;
  color:rgba(255,255,255,0.72);
  font-size:.86rem;
}

.page-id-376 .portfolio-album-gallery{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
}

.page-id-376 .portfolio-photo-item{
  display:block;
  position:relative;
  border-radius:24px;
  overflow:hidden;
  background:#16242f;
  border:1px solid rgba(243,176,63,0.16);
  box-shadow:
    0 16px 40px rgba(0,0,0,0.18),
    0 0 14px rgba(243,176,63,0.04);
}

.page-id-376 .portfolio-photo-item img{
  width:100%;
  display:block;
  aspect-ratio:4 / 3;
  object-fit:cover;
  transition:transform .4s ease;
}

.page-id-376 .portfolio-photo-item:hover img{
  transform:scale(1.03);
}

.page-id-376 .portfolio-photo-item::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top, rgba(34,53,69,.18), rgba(34,53,69,0));
  pointer-events:none;
}

@media (max-width: 980px){
  .page-id-376 .portfolio-album-gallery{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px){
  .page-id-376 .portfolio-audiovisual-page{
    padding:42px 0 74px !important;
  }

  .page-id-376 .portfolio-audiovisual-header{
    margin-bottom:26px;
  }

  .page-id-376 .portfolio-audiovisual-header h1{
    font-size:2.1rem;
    line-height:1.06;
  }

  .page-id-376 .portfolio-audiovisual-header p{
    font-size:.95rem;
    line-height:1.55;
    max-width:320px;
  }

  .page-id-376 .portfolio-audiovisual-nav{
    gap:10px;
    margin-bottom:26px;
  }

  .page-id-376 .portfolio-tab{
    font-size:.88rem;
    min-height:40px;
    padding:10px 16px;
  }

  .page-id-376 .portfolio-video-meta h2{
    font-size:1.12rem;
  }

  .page-id-376 .portfolio-video-meta p{
    font-size:.9rem;
  }

  .page-id-376 .portfolio-album-gallery{
    grid-template-columns:1fr;
  }

  .page-id-376 .reel-item{
    min-width:220px;
    height:390px;
  }
}
.page-id-376 .portfolio-audiovisual-header{
  text-align:center;
  margin:0 0 34px;
}

.page-id-376 .portfolio-audiovisual-brand{
  display:block;
  width:min(420px, 78vw);
  height:auto;
  margin:0 auto;
}

@media (max-width:768px){
  .page-id-376 .portfolio-audiovisual-brand{
    width:min(300px, 78vw);
  }
}
.page-id-376 .portfolio-audiovisual-header{
  text-align:center;
  margin:0 0 20px; /* abans 34px → menys aire a sota */
  padding-top:10px; /* controla separació amb menú */
}

.page-id-376 .portfolio-audiovisual-brand{
  display:block;
  width:min(280px, 55vw); /* abans 420 → molt més fi */
  height:auto;
  margin:0 auto;
}
.page-id-376 .ast-primary-header-bar{
  background:#223545 !important;
  border-bottom:none !important;
  box-shadow:none !important;
}
/* =========================
   PAGE 376 · HEADER FUSIONAT + LOGO MÉS AMUNT
   ========================= */

.page-id-376,
.page-id-376 .site,
.page-id-376 .site-content,
.page-id-376 #primary,
.page-id-376 .entry-content,
.page-id-376 .site-main,
.page-id-376 .portfolio-audiovisual-page{
  background:#223545 !important;
  background-image:none !important;
}

/* matar el color/espai del header de la plantilla */
.page-id-376 .site-header,
.page-id-376 #masthead,
.page-id-376 .main-header-bar,
.page-id-376 .ast-builder-grid-row-container,
.page-id-376 .ast-builder-row,
.page-id-376 .site-primary-header-wrap,
.page-id-376 .ast-primary-header-bar{
  background:#223545 !important;
  background-image:none !important;
  border:none !important;
  box-shadow:none !important;
  min-height:0 !important;
}

/* treure separadors o pseudo-elements */
.page-id-376 .site-header::before,
.page-id-376 .site-header::after,
.page-id-376 #masthead::before,
.page-id-376 #masthead::after,
.page-id-376 .main-header-bar::before,
.page-id-376 .main-header-bar::after{
  display:none !important;
  content:none !important;
}

/* si la top bar encara pinta diferent */
.page-id-376 .top-social{
  background:#223545 !important;
  border:none !important;
  box-shadow:none !important;
}

/* pujar tota la pàgina audiovisual */
.page-id-376 .portfolio-audiovisual-page{
  padding-top:18px !important;
}

/* contenidor del logo més amunt i més compacte */
.page-id-376 .portfolio-audiovisual-header{
  margin:0 0 18px !important;
  padding-top:0 !important;
  transform:translateY(-30px);
}

/* logo més petit */
.page-id-376 .portfolio-audiovisual-brand{
  display:block;
  width:min(260px, 46vw) !important;
  height:auto !important;
  margin:0 auto !important;
}
/* =========================
   PAGE 376 · UNIFICAR TOT EL FONS
   HEADER + COS + FOOTER IGUALS
   ========================= */

.page-id-376,
.page-id-376 html,
.page-id-376 body,
.page-id-376 .site,
.page-id-376 .site-content,
.page-id-376 #primary,
.page-id-376 .site-main,
.page-id-376 .entry-content,
.page-id-376 .top-home,
.page-id-376 .portfolio-audiovisual-page,
.page-id-376 .site-above-footer-wrap,
.page-id-376 .footer-premium,
.page-id-376 footer,
.page-id-376 .site-footer{
  background:#223545 !important;
  background-image:none !important;
}

/* header Astra complet */
.page-id-376 .site-header,
.page-id-376 #masthead,
.page-id-376 .main-header-bar,
.page-id-376 .ast-builder-grid-row-container,
.page-id-376 .ast-builder-row,
.page-id-376 .site-primary-header-wrap,
.page-id-376 .ast-primary-header-bar,
.page-id-376 .ast-header-break-point .main-header-bar,
.page-id-376 .ast-theme-transparent-header #masthead{
  background:#223545 !important;
  background-image:none !important;
  border:none !important;
  box-shadow:none !important;
}

/* franja superior també igual */
.page-id-376 .top-social{
  background:#223545 !important;
  min-height:28px !important;
  height:28px !important;
  border:none !important;
  box-shadow:none !important;
}

/* eliminar línies o pseudo-elements que poden tenyir */
.page-id-376 .site-header::before,
.page-id-376 .site-header::after,
.page-id-376 #masthead::before,
.page-id-376 #masthead::after,
.page-id-376 .main-header-bar::before,
.page-id-376 .main-header-bar::after,
.page-id-376 .top-home::before,
.page-id-376 .top-home::after,
.page-id-376 .top-social::before,
.page-id-376 .top-social::after{
  display:none !important;
  content:none !important;
}

/* treure espai superior real del contenidor de plantilla */
.page-id-376 .top-home{
  padding-top:0 !important;
  padding-bottom:0 !important;
  margin:0 !important;
  border:none !important;
  box-shadow:none !important;
}

/* pujar el bloc principal */
.page-id-376 .portfolio-audiovisual-page{
  padding-top:0 !important;
}

/* pujar més el logo */
.page-id-376 .portfolio-audiovisual-header{
  margin:0 0 18px !important;
  padding-top:0 !important;
  transform:translateY(-88px) !important;
}

/* logo més contingut */
.page-id-376 .portfolio-audiovisual-brand{
  display:block;
  width:min(240px, 42vw) !important;
  height:auto !important;
  margin:0 auto !important;
}
/* =========================
   PAGE 376 · HEADER MATEIX COLOR QUE EL COS
   ========================= */

.page-id-376,
.page-id-376 .site,
.page-id-376 .site-content,
.page-id-376 #primary,
.page-id-376 .entry-content,
.page-id-376 .site-main,
.page-id-376 .top-home,
.page-id-376 .portfolio-audiovisual-page,
.page-id-376 footer,
.page-id-376 .site-footer,
.page-id-376 .site-above-footer-wrap{
  background:#223545 !important;
  background-image:none !important;
}

.page-id-376 .site-header,
.page-id-376 #masthead,
.page-id-376 .main-header-bar,
.page-id-376 .ast-builder-grid-row-container,
.page-id-376 .ast-builder-row,
.page-id-376 .site-primary-header-wrap,
.page-id-376 .ast-primary-header-bar,
.page-id-376 .ast-theme-transparent-header #masthead{
  background:#223545 !important;
  background-image:none !important;
  border:none !important;
  box-shadow:none !important;
}

.page-id-376 .top-social{
  background:#223545 !important;
  border:none !important;
  box-shadow:none !important;
}

.page-id-376 .site-header::before,
.page-id-376 .site-header::after,
.page-id-376 #masthead::before,
.page-id-376 #masthead::after,
.page-id-376 .main-header-bar::before,
.page-id-376 .main-header-bar::after,
.page-id-376 .top-social::before,
.page-id-376 .top-social::after{
  display:none !important;
  content:none !important;
}
/* =========================
   PAGE 376 · FONS UNIFICAT TOTAL
   ========================= */

html body.page-id-376,
html body.page-id-376 .site,
html body.page-id-376 .site-content,
html body.page-id-376 #content,
html body.page-id-376 #primary,
html body.page-id-376 .site-main,
html body.page-id-376 .entry-content,
html body.page-id-376 .top-home,
html body.page-id-376 .portfolio-audiovisual-page,
html body.page-id-376 .site-above-footer-wrap,
html body.page-id-376 .site-footer{
  background:#223545 !important;
  background-image:none !important;
}

/* header Astra complet */
html body.page-id-376 .site-header,
html body.page-id-376 #masthead,
html body.page-id-376 .main-header-bar,
html body.page-id-376 .ast-builder-grid-row-container,
html body.page-id-376 .ast-builder-row,
html body.page-id-376 .site-primary-header-wrap,
html body.page-id-376 .ast-primary-header-bar,
html body.page-id-376 .ast-desktop-header-content,
html body.page-id-376 .ast-mobile-header-wrap,
html body.page-id-376 .ast-mobile-header-content,
html body.page-id-376 .ast-theme-transparent-header #masthead,
html body.page-id-376 header{
  background:#223545 !important;
  background-image:none !important;
  border:none !important;
  box-shadow:none !important;
}

/* top bar superior */
html body.page-id-376 .top-social,
html body.page-id-376 .top-social .container{
  background:#223545 !important;
  background-image:none !important;
  border:none !important;
  box-shadow:none !important;
}

/* pseudo-elements que poden enfosquir */
html body.page-id-376 .site-header::before,
html body.page-id-376 .site-header::after,
html body.page-id-376 #masthead::before,
html body.page-id-376 #masthead::after,
html body.page-id-376 .main-header-bar::before,
html body.page-id-376 .main-header-bar::after,
html body.page-id-376 .ast-builder-grid-row-container::before,
html body.page-id-376 .ast-builder-grid-row-container::after,
html body.page-id-376 .top-social::before,
html body.page-id-376 .top-social::after{
  display:none !important;
  content:none !important;
  background:none !important;
}

/* per si el transparent header d'Astra hi posa opacitat */
html body.page-id-376.ast-theme-transparent-header #masthead{
  position:relative !important;
  background:#223545 !important;
}/* =========================
   PAGE 376 · PORTFOLI AUDIOVISUAL · BASE NETA
   ========================= */

html body.page-id-376,
html body.page-id-376 .site,
html body.page-id-376 .site-content,
html body.page-id-376 #content,
html body.page-id-376 #primary,
html body.page-id-376 .site-main,
html body.page-id-376 .entry-content,
html body.page-id-376 .top-home,
html body.page-id-376 .portfolio-audiovisual-page,
html body.page-id-376 footer,
html body.page-id-376 .site-footer,
html body.page-id-376 .site-above-footer-wrap,
html body.page-id-376 .footer-premium{
  background:#223545 !important;
  background-image:none !important;
}

/* header Astra complet */
html body.page-id-376 .site-header,
html body.page-id-376 #masthead,
html body.page-id-376 .main-header-bar,
html body.page-id-376 .ast-builder-grid-row-container,
html body.page-id-376 .ast-builder-row,
html body.page-id-376 .site-primary-header-wrap,
html body.page-id-376 .ast-primary-header-bar,
html body.page-id-376 .ast-desktop-header-content,
html body.page-id-376 .ast-mobile-header-wrap,
html body.page-id-376 .ast-mobile-header-content,
html body.page-id-376 .ast-theme-transparent-header #masthead,
html body.page-id-376 header{
  background:#223545 !important;
  background-image:none !important;
  border:none !important;
  box-shadow:none !important;
}

/* top bar */
html body.page-id-376 .top-social,
html body.page-id-376 .top-social .container{
  background:#223545 !important;
  background-image:none !important;
  border:none !important;
  box-shadow:none !important;
}

/* pseudo-elements molestos */
html body.page-id-376 .site-header::before,
html body.page-id-376 .site-header::after,
html body.page-id-376 #masthead::before,
html body.page-id-376 #masthead::after,
html body.page-id-376 .main-header-bar::before,
html body.page-id-376 .main-header-bar::after,
html body.page-id-376 .ast-builder-grid-row-container::before,
html body.page-id-376 .ast-builder-grid-row-container::after,
html body.page-id-376 .top-home::before,
html body.page-id-376 .top-home::after,
html body.page-id-376 .top-social::before,
html body.page-id-376 .top-social::after{
  display:none !important;
  content:none !important;
  background:none !important;
}

/* contenidor de plantilla */
.page-id-376 .top-home{
  padding-top:0 !important;
  padding-bottom:0 !important;
  margin:0 !important;
  border:none !important;
  box-shadow:none !important;
}

/* =========================
   PAGE 376 · BLOC PRINCIPAL
   ========================= */

.page-id-376 .portfolio-audiovisual-page{
  padding:0 0 110px !important;
  transform:translateY(-50px);
}

/* header amb logo */
.page-id-376 .portfolio-audiovisual-header{
  max-width:920px;
  margin:0 auto 22px !important;
  padding-top:0 !important;
  text-align:center;
}

.page-id-376 .portfolio-audiovisual-brand{
  display:block;
  width:min(240px, 42vw) !important;
  height:auto !important;
  margin:0 auto !important;
}

/* =========================
   PAGE 376 · NAVEGACIÓ TABS
   ========================= */

.page-id-376 .portfolio-audiovisual-nav{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin:0 auto 34px;
  padding:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

.page-id-376 .portfolio-tab{
  appearance:none;
  -webkit-appearance:none;
  border:1px solid rgba(255,255,255,0.22);
  border-radius:999px;
  padding:12px 22px;
  min-height:44px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.34);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:
    0 8px 20px rgba(0,0,0,0.16),
    inset 0 1px 0 rgba(255,255,255,0.16);
  color:rgba(255,255,255,0.88);
  font-family:"Arial Rounded MT";
  font-size:.95rem;
  line-height:1;
  cursor:pointer;
  transition:
    border-color .25s ease,
    background .25s ease,
    box-shadow .25s ease,
    color .25s ease,
    transform .25s ease;
}

.page-id-376 .portfolio-tab:hover{
  border-color:#f3b03f;
  color:#f3b03f;
  transform:translateY(-1px);
  box-shadow:
    0 10px 24px rgba(0,0,0,0.20),
    0 0 12px rgba(243,176,63,0.12);
}

.page-id-376 .portfolio-tab.is-active{
  border-color:rgba(243,176,63,0.72);
  color:#f3b03f;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.04)),
    rgba(34,53,69,0.44);
  box-shadow:
    0 12px 28px rgba(0,0,0,0.24),
    0 0 14px rgba(243,176,63,0.16),
    inset 0 1px 0 rgba(255,255,255,0.18);
}

/* panels */
.page-id-376 .portfolio-panel{
  display:none;
}

.page-id-376 .portfolio-panel.is-active{
  display:block;
  animation:portfolioFade376 .45s ease;
}

@keyframes portfolioFade376{
  from{
    opacity:0;
    transform:translateY(12px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}



/* =========================
   PAGE 376 · REELS
   ========================= */

.page-id-376 .portfolio-reels-row{
  display:flex;
  gap:22px;
  overflow-x:auto;
  padding:10px 6px 18px;
  scroll-snap-type:x mandatory;
}

.page-id-376 .portfolio-reels-row::-webkit-scrollbar{
  display:none;
}

.page-id-376 .reel-item{
  position:relative;
  min-width:250px;
  height:440px;
  flex-shrink:0;
  scroll-snap-align:start;
  border-radius:26px;
  overflow:hidden;
  background:
    linear-gradient(145deg, rgba(255,255,255,0.07), rgba(255,255,255,0.02)),
    rgba(17,24,32,0.92);
  border:1px solid rgba(243,176,63,0.20);
  box-shadow:
    0 20px 50px rgba(0,0,0,0.22),
    0 0 16px rgba(243,176,63,0.06);
  transition:
    transform .3s ease,
    border-color .3s ease,
    box-shadow .3s ease;
}

.page-id-376 .reel-item:hover{
  transform:translateY(-4px);
  border-color:rgba(243,176,63,0.42);
  box-shadow:
    0 28px 70px rgba(0,0,0,0.30),
    0 0 20px rgba(243,176,63,0.12);
}

.page-id-376 .reel-media{
  width:100%;
  height:100%;
}

.page-id-376 .reel-media video{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.page-id-376 .reel-overlay{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:18px 16px;
  background:linear-gradient(to top, rgba(0,0,0,.72), rgba(0,0,0,0));
}

.page-id-376 .reel-overlay h3{
  margin:0;
  color:#ffffff;
  font-size:14px;
  line-height:1.35;
  font-family:"Varela Round";
}

/* =========================
   PAGE 376 · FOTOGRAFIA
   ========================= */

.page-id-376 .portfolio-albums-wrap{
  display:flex;
  flex-direction:column;
  gap:52px;
  max-width:1120px;
  margin:0 auto;
}

.page-id-376 .portfolio-album-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  margin:0 0 18px;
}

.page-id-376 .portfolio-album-head h2{
  margin:0;
  color:#ffffff;
  font-family:"Arial Rounded MT";
  font-size:1.7rem;
  line-height:1.08;
}

.page-id-376 .portfolio-album-type{
  display:inline-flex;
  align-items:center;
  border:1px solid rgba(255,255,255,0.12);
  border-radius:999px;
  padding:8px 14px;
  color:rgba(255,255,255,0.72);
  font-size:.86rem;
}

.page-id-376 .portfolio-album-gallery{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
}

.page-id-376 .portfolio-photo-item{
  display:block;
  position:relative;
  border-radius:24px;
  overflow:hidden;
  background:#16242f;
  border:1px solid rgba(243,176,63,0.16);
  box-shadow:
    0 16px 40px rgba(0,0,0,0.18),
    0 0 14px rgba(243,176,63,0.04);
}

.page-id-376 .portfolio-photo-item img{
  width:100%;
  display:block;
  aspect-ratio:4 / 3;
  object-fit:cover;
  transition:transform .4s ease;
}

.page-id-376 .portfolio-photo-item:hover img{
  transform:scale(1.03);
}

.page-id-376 .portfolio-photo-item::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top, rgba(34,53,69,.18), rgba(34,53,69,0));
  pointer-events:none;
}

.page-id-376 .portfolio-empty{
  text-align:center;
  color:rgba(255,255,255,0.72);
}
/* =========================
   PAGE 376 · HERO AUDIOVISUAL FINAL
   ========================= */

.page-id-376{
  position:relative;
}

/* LOGO */
.page-id-376 .portfolio-audiovisual-header{
  position:relative;
  width:100%;
  max-width:980px;
  margin:52px auto 0 !important;
  text-align:center;
  z-index:10;
  opacity:0.92;
}

.page-id-376 .portfolio-audiovisual-header img,
.page-id-376 .portfolio-audiovisual-brand{
  display:block;
  width:100%;
  max-width:150px;
  height:auto;
  margin:0 auto;
}

/* amagar qualsevol línia antiga del header */
.page-id-376 .portfolio-audiovisual-header::before,
.page-id-376 .portfolio-audiovisual-header::after{
  display:none !important;
  content:none !important;
}

/* NAV */
.page-id-376 .portfolio-audiovisual-nav{
  position:relative;
  z-index:5;
  display:flex;
  justify-content:center;
  gap:14px;
  margin:26px auto 56px !important;
  padding:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

/* tabs */
.page-id-376 .portfolio-tab{
  border:1px solid rgba(255,255,255,0.18);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.32);
  color:rgba(255,255,255,0.92);
  border-radius:999px;
  padding:12px 22px;
  transition:all .25s ease;
}

.page-id-376 .portfolio-tab.is-active{
  border-color:#f3b03f;
  color:#f3b03f;
  box-shadow:
    0 0 0 1px rgba(243,176,63,0.18),
    0 0 10px rgba(243,176,63,0.12);
}

/* SLIDER */
.page-id-376 .portfolio-video-slider{
  position:relative;
  max-width:980px;
  margin:22px auto 0;
}

/* una sola línia llarga */
.page-id-376 .portfolio-video-slider::before{
  content:"";
  position:absolute;
  top:-84px;
  left:50%;
  transform:translateX(-50%);
  width:min(980px, 90vw);
  height:1px;
  background:linear-gradient(
    90deg,
    transparent 0%,
    rgba(243,176,63,0.16) 10%,
    rgba(243,176,63,0.42) 50%,
    rgba(243,176,63,0.16) 90%,
    transparent 100%
  );
  opacity:0.95;
  pointer-events:none;
}

/* CARDS */
.page-id-376 .portfolio-video-card{
  display:none;
  position:relative;
  background:transparent;
  border:none;
  border-radius:34px;
  overflow:visible;
  box-shadow:none;
}

.page-id-376 .portfolio-video-card.is-active{
  display:block;
  animation:portfolioFade376 .4s ease;
}

/* MARC DEL VÍDEO */
.page-id-376 .portfolio-video-media{
  position:relative;
  overflow:hidden;
  border-radius:34px;
  background:#111820;
  border:1.5px solid rgba(243,176,63,0.78);
  box-shadow:
    0 0 0 1px rgba(243,176,63,0.16),
    0 12px 34px rgba(0,0,0,0.30),
    0 0 20px rgba(243,176,63,0.14);
}

.page-id-376 .portfolio-video-media::before{
  content:"";
  position:absolute;
  inset:-7px;
  border-radius:40px;
  background:radial-gradient(
    circle,
    rgba(243,176,63,0.16) 0%,
    rgba(243,176,63,0.08) 42%,
    rgba(243,176,63,0) 74%
  );
  filter:blur(18px);
  z-index:-1;
  pointer-events:none;
}

.page-id-376 .portfolio-video-media video{
  width:100%;
  height:auto;
  aspect-ratio:16 / 9;
  object-fit:cover;
  display:block;
  background:#000;
  transition:transform 1.6s ease;
}

.page-id-376 .portfolio-video-media:hover video{
  transform:scale(1.04);
}

/* overlay */
.page-id-376 .portfolio-video-overlay{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(
    to top,
    rgba(13,20,28,0.76) 0%,
    rgba(13,20,28,0.42) 24%,
    rgba(13,20,28,0.12) 46%,
    rgba(13,20,28,0) 68%
  );
}

/* caption */
.page-id-376 .portfolio-video-caption{
  position:absolute;
  left:28px;
  bottom:24px;
  z-index:3;
  max-width:62%;
  text-align:left;
  pointer-events:auto;
}

.page-id-376 .portfolio-video-caption h2{
  margin:0 0 6px;
  color:#ffffff;
  font-family:"Arial Rounded MT";
  font-size:2rem;
  line-height:1.02;
  letter-spacing:-0.015em;
}

.page-id-376 .portfolio-video-caption p{
  margin:0;
  color:rgba(255,255,255,0.72);
  font-size:1rem;
  line-height:1.45;
  letter-spacing:0.2px;
}

/* fletxes */
.page-id-376 .portfolio-video-arrows{
  position:absolute;
  right:24px;
  bottom:24px;
  z-index:4;
  display:flex;
  align-items:center;
  gap:8px;
  pointer-events:auto;
}

.page-id-376 .portfolio-video-arrow{
  appearance:none;
  -webkit-appearance:none;
  width:40px;
  height:40px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.18);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.32);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  color:#ffffff;
  font-size:18px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  opacity:0.82;
  transition:
    border-color .25s ease,
    color .25s ease,
    background .25s ease,
    transform .25s ease,
    box-shadow .25s ease,
    opacity .25s ease;
}

.page-id-376 .portfolio-video-arrow:hover{
  border-color:#f3b03f;
  color:#f3b03f;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.04)),
    rgba(34,53,69,0.48);
  transform:translateY(-1px);
  box-shadow:
    0 6px 18px rgba(0,0,0,0.22),
    0 0 10px rgba(243,176,63,0.12);
  opacity:1;
}

/* meta antiga fora */
.page-id-376 .portfolio-video-meta{
  display:none !important;
}

/* responsive */
@media (max-width:768px){
  .page-id-376 .portfolio-audiovisual-header{
    margin:38px auto 0 !important;
  }

  .page-id-376 .portfolio-audiovisual-header img,
  .page-id-376 .portfolio-audiovisual-brand{
    max-width:122px;
  }

  .page-id-376 .portfolio-audiovisual-nav{
    margin:22px auto 38px !important;
    gap:10px;
  }

  .page-id-376 .portfolio-tab{
    font-size:.88rem;
    min-height:40px;
    padding:10px 16px;
  }

  .page-id-376 .portfolio-video-slider{
    margin-top:14px;
  }

  .page-id-376 .portfolio-video-slider::before{
    top:-62px;
    width:min(92vw, 680px);
  }

  .page-id-376 .portfolio-video-media{
    border-radius:26px;
  }

  .page-id-376 .portfolio-video-media::before{
    inset:-6px;
    border-radius:30px;
    filter:blur(14px);
  }

  .page-id-376 .portfolio-video-caption{
    left:22px;
    bottom:20px;
    max-width:72%;
  }

  .page-id-376 .portfolio-video-caption h2{
    font-size:1.45rem;
  }

  .page-id-376 .portfolio-video-caption p{
    font-size:.92rem;
  }

  .page-id-376 .portfolio-video-arrows{
    right:16px;
    bottom:16px;
  }

  .page-id-376 .portfolio-video-arrow{
    width:38px;
    height:38px;
    font-size:17px;
  }
}
/* =========================
   MICRO-REFINAMENT FINAL
   ========================= */

/* 1. LOGO una mica més gran i amb més presència */
.page-id-376 .portfolio-audiovisual-header img,
.page-id-376 .portfolio-audiovisual-brand{
  max-width:165px;
}

/* 2. Compactar verticalment (menys espai mort) */
.page-id-376 .portfolio-audiovisual-header{
  margin:42px auto 0 !important;
}

.page-id-376 .portfolio-audiovisual-nav{
  margin:20px auto 50px !important;
}

/* 3. Línia més subtil (menys protagonista) */
.page-id-376 .portfolio-video-slider::before{
  opacity:0.65;
  background:linear-gradient(
    90deg,
    transparent 0%,
    rgba(243,176,63,0.10) 12%,
    rgba(243,176,63,0.30) 50%,
    rgba(243,176,63,0.10) 88%,
    transparent 100%
  );
}

/* 4. Petit refinament tipogràfic (molt subtil però premium) */
.page-id-376 .portfolio-video-caption h2{
  letter-spacing:-0.01em;
}

.page-id-376 .portfolio-video-caption p{
  opacity:0.85;
}
/* =========================
   LOGO · PRESÈNCIA ++ + POSICIÓ
   ========================= */

/* més gran i amb més pes */
.page-id-376 .portfolio-audiovisual-header img,
.page-id-376 .portfolio-audiovisual-brand{
  max-width:195px;

  filter:
    drop-shadow(0 14px 34px rgba(0,0,0,0.38))
    drop-shadow(0 0 18px rgba(243,176,63,0.18));
}

/* baixar el bloc */
.page-id-376 .portfolio-audiovisual-header{
  margin:68px auto 0 !important;
  opacity:1;
}

/* glow més present però elegant */
.page-id-376 .portfolio-audiovisual-header::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  width:240px;
  height:240px;
  border-radius:50%;

  background:radial-gradient(
    circle,
    rgba(243,176,63,0.20) 0%,
    rgba(243,176,63,0.08) 42%,
    transparent 75%
  );

  filter:blur(26px);
  z-index:-1;
  pointer-events:none;
  opacity:0.85;
}
.page-id-376 .portfolio-audiovisual-header{
  margin:78px auto 0 !important;
}
.page-id-376 .portfolio-audiovisual-header::before{
  opacity:0.65;
}
/* =========================
   PAGE 376 · REELS SLIDER PREMIUM
   ========================= */

.page-id-376 .portfolio-reels-slider{
  position:relative;
  max-width:980px;
  margin:22px auto 0;
}

.page-id-376 .portfolio-reels-slider::before{
  content:"";
  position:absolute;
  top:-84px;
  left:50%;
  transform:translateX(-50%);
  width:min(780px, 80vw);
  height:1px;
  background:linear-gradient(
    90deg,
    transparent 0%,
    rgba(243,176,63,0.10) 12%,
    rgba(243,176,63,0.30) 50%,
    rgba(243,176,63,0.10) 88%,
    transparent 100%
  );
  opacity:0.7;
  pointer-events:none;
}

.page-id-376 .reel-item{
  display:none;
  justify-content:center;
}

.page-id-376 .reel-item.is-active{
  display:flex;
  animation:portfolioFade376 .4s ease;
}

.page-id-376 .reel-media{
  position:relative;
  width:100%;
  max-width:420px;
  aspect-ratio:9 / 16;
  overflow:hidden;
  border-radius:28px;
  background:#111820;
  border:1.2px solid rgba(243,176,63,0.72);
  box-shadow:
    0 0 0 1px rgba(243,176,63,0.12),
    0 10px 30px rgba(0,0,0,0.28),
    0 0 16px rgba(243,176,63,0.10);
}

.page-id-376 .reel-media::before{
  content:"";
  position:absolute;
  inset:-6px;
  border-radius:32px;
  background:radial-gradient(
    circle,
    rgba(243,176,63,0.14) 0%,
    rgba(243,176,63,0.06) 40%,
    transparent 75%
  );
  filter:blur(16px);
  z-index:-1;
}

.page-id-376 .reel-media video{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  background:#000;
  transition:transform 1.6s ease;
}

.page-id-376 .reel-media:hover video{
  transform:scale(1.04);
}

.page-id-376 .reel-overlay{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(
    to top,
    rgba(13,20,28,0.65),
    rgba(13,20,28,0.25),
    rgba(13,20,28,0.05),
    transparent
  );
}

.page-id-376 .reel-caption{
  position:absolute;
  left:20px;
  bottom:18px;
  z-index:3;
  max-width:75%;
  text-align:left;
}

.page-id-376 .reel-caption h3{
  margin:0 0 4px;
  color:#ffffff;
  font-size:1.2rem;
  line-height:1.1;
  letter-spacing:-0.01em;
}

.page-id-376 .reel-caption p{
  margin:0;
  color:rgba(255,255,255,0.72);
  font-size:0.9rem;
  line-height:1.4;
}

.page-id-376 .reel-arrows{
  position:absolute;
  right:14px;
  bottom:14px;
  z-index:4;
  display:flex;
  gap:8px;
}

.page-id-376 .reel-arrow{
  appearance:none;
  width:34px;
  height:34px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.18);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02)),
    rgba(34,53,69,0.32);
  color:#ffffff;
  font-size:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  opacity:0.82;
  transition:all .25s ease;
}

.page-id-376 .reel-arrow:hover{
  border-color:#f3b03f;
  color:#f3b03f;
  box-shadow:
    0 6px 16px rgba(0,0,0,0.22),
    0 0 8px rgba(243,176,63,0.12);
}

@media (max-width:768px){
  .page-id-376 .portfolio-reels-slider{
    margin-top:14px;
  }

  .page-id-376 .portfolio-reels-slider::before{
    top:-62px;
    width:min(90vw, 520px);
  }

  .page-id-376 .reel-media{
    max-width:82vw;
    border-radius:24px;
  }

  .page-id-376 .reel-caption{
    left:16px;
    bottom:16px;
  }

  .page-id-376 .reel-caption h3{
    font-size:1.05rem;
  }

  .page-id-376 .reel-caption p{
    font-size:0.85rem;
  }

  .page-id-376 .reel-arrow{
    width:30px;
    height:30px;
    font-size:14px;
  }
}
/* =========================
   REELS · ELIMINAR MARC HORITZONTAL
   ========================= */

.page-id-376 .portfolio-reels-slider{
  background:none !important;
  border:none !important;
  box-shadow:none !important;
  padding:0 !important;
}

/* si tens algun wrapper tipus card gran */
.page-id-376 .portfolio-reels-slider::after,
.page-id-376 .portfolio-reels-slider::before{
  /* mantenim només la línia, no cap caixa */
}

/* centrar reel com a peça única */
.page-id-376 .reel-item{
  display:none;
  justify-content:center;
}

.page-id-376 .reel-item.is-active{
  display:flex;
}

/* fer el reel més protagonista */
.page-id-376 .reel-media{
  max-width:440px; /* pots pujar fins 460 si vols més impacte */
}
/* =========================
   REELS · TREURE CAIXA HORITZONTAL
   ========================= */

/* el contenidor general no ha de semblar una card */
.page-id-376 .portfolio-reels-slider{
  max-width:none !important;
  margin:22px auto 0 !important;
  padding:0 !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}

/* si hi ha algun wrapper extern fent de caixa */
.page-id-376 .portfolio-panel[data-panel="reels"]{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}

/* aquesta és la clau: el reel ha de centrar-se i prou */
.page-id-376 .reel-item{
  display:none !important;
  width:100%;
  justify-content:center !important;
  align-items:center !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  min-width:0 !important;
  height:auto !important;
  overflow:visible !important;
}

.page-id-376 .reel-item.is-active{
  display:flex !important;
}

/* matar qualsevol fons o marc que vingui de l'estructura antiga */
.page-id-376 .portfolio-reels-row,
.page-id-376 .portfolio-reels-grid{
  display:block !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  padding:0 !important;
  max-width:none !important;
}

/* deixar el reel com a única peça protagonista */
.page-id-376 .reel-media{
  width:100% !important;
  max-width:380px !important;
  aspect-ratio:9 / 16 !important;
  margin:0 auto !important;
}

/* assegurar que no hi ha pseudo-elements antics fent caixa */
.page-id-376 .portfolio-reels-slider::after,
.page-id-376 .reel-item::before,
.page-id-376 .reel-item::after{
  display:none !important;
  content:none !important;
}
.page-id-376 .reel-media{
  transition: transform .4s ease, box-shadow .4s ease;
}

.page-id-376 .reel-media:hover{
  transform: translateY(-6px);
}
/* =========================
   AJUST VERTICAL · LOGO / TABS / PECA
   ========================= */

/* pujar una mica els tabs */
.page-id-376 .portfolio-audiovisual-nav{
  margin-top: 120px !important;
  margin-bottom: 34px !important;
}

/* pujar la peça principal */
.page-id-376 .portfolio-video-slider,
.page-id-376 .portfolio-reels-slider{
  margin-top: 6px !important;
}
/* =========================
   RESET AJUST VERTICAL TRENCAT
   ========================= */

/* no forcem tant el bloc dels tabs */
.page-id-376 .portfolio-audiovisual-nav{
  margin-top: 150px !important;
  margin-bottom: 38px !important;
}

/* no pugem artificialment vídeo/reel */
.page-id-376 .portfolio-video-slider,
.page-id-376 .portfolio-reels-slider{
  margin-top: 0 !important;
}

/* mantenir la línia en bona posició */
.page-id-376 .portfolio-video-slider::before,
.page-id-376 .portfolio-reels-slider::before{
  top: -70px !important;
}
/* =========================
   COMPACTAR BLOC AUDIOVISUAL CAP AMUNT
   ========================= */

/* pujar tabs */
.page-id-376 .portfolio-audiovisual-nav{
  margin-top: -40px !important;   /* abans 140-150 */
  margin-bottom: 26px !important;
}

/* pujar la línia (alineada amb tabs) */
.page-id-376 .portfolio-video-slider::before,
.page-id-376 .portfolio-reels-slider::before{
  top: -54px !important;
}

/* apropar peça (video/reel) als tabs */
.page-id-376 .portfolio-video-slider,
.page-id-376 .portfolio-reels-slider{
  margin-top: -6px !important;
}
/* =========================
   RESPONSIVE FI · VIDEO + REEL
   ========================= */

/* vídeo: més flexible segons amplada de pantalla */
.page-id-376 .portfolio-video-slider{
  width:min(100%, 860px) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

.page-id-376 .portfolio-video-card,
.page-id-376 .portfolio-video-media{
  width:100% !important;
}

/* reel: una mica més contingut en pantalles no tan grans */
.page-id-376 .reel-media{
  width:min(100%, 380px) !important;
  margin:0 auto !important;
}

/* portàtils i pantalles mitjanes */
@media (max-width: 1400px){
  .page-id-376 .portfolio-video-slider{
    width:min(100%, 800px) !important;
  }

  .page-id-376 .reel-media{
    width:min(100%, 360px) !important;
  }
}

/* pantalles més estretes */
@media (max-width: 1200px){
  .page-id-376 .portfolio-video-slider{
    width:min(100%, 740px) !important;
  }

  .page-id-376 .reel-media{
    width:min(100%, 340px) !important;
  }
}

/* tablet */
@media (max-width: 980px){
  .page-id-376 .portfolio-video-slider{
    width:min(100%, 680px) !important;
  }

  .page-id-376 .reel-media{
    width:min(100%, 320px) !important;
  }
}

/* mòbil gran */
@media (max-width: 768px){
  .page-id-376 .portfolio-video-slider{
    width:100% !important;
  }

  .page-id-376 .reel-media{
    width:min(100%, 82vw) !important;
  }
}
/* =========================
   RESPONSIVE REAL · VIDEO + REEL
   ========================= */

/* vídeo */
.page-id-376 .portfolio-video-slider{
  width:100% !important;
  max-width:860px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

.page-id-376 .portfolio-video-card,
.page-id-376 .portfolio-video-media{
  width:100% !important;
  max-width:none !important;
}

/* reel */
.page-id-376 .portfolio-panel[data-panel="reels"] .reel-item.is-active{
  display:flex !important;
  justify-content:center !important;
}

.page-id-376 .portfolio-panel[data-panel="reels"] .reel-media{
  width:100% !important;
  max-width:380px !important;
  margin:0 auto !important;
}

/* portàtil */
@media (max-width: 1400px){
  .page-id-376 .portfolio-video-slider{
    max-width:800px !important;
  }

  .page-id-376 .portfolio-panel[data-panel="reels"] .reel-media{
    max-width:350px !important;
  }
}

/* pantalles intermèdies */
@media (max-width: 1200px){
  .page-id-376 .portfolio-video-slider{
    max-width:720px !important;
  }

  .page-id-376 .portfolio-panel[data-panel="reels"] .reel-media{
    max-width:320px !important;
  }
}

/* tablet */
@media (max-width: 980px){
  .page-id-376 .portfolio-video-slider{
    max-width:640px !important;
  }

  .page-id-376 .portfolio-panel[data-panel="reels"] .reel-media{
    max-width:300px !important;
  }
}

/* mòbil */
@media (max-width: 768px){
  .page-id-376 .portfolio-video-slider{
    max-width:100% !important;
  }

  .page-id-376 .portfolio-panel[data-panel="reels"] .reel-media{
    width:min(100%, 82vw) !important;
    max-width:none !important;
  }
}
/* =========================================
   PAGE 376 · FOTOGRAFIA · FILTRES + ÀLBUMS
   Bloc final net
   ========================================= */

/* amagar fotos extres fins clicar +n */
.portfolio-album-gallery .portfolio-photo-item.is-hidden{
  display:none !important;
}

/* segon nivell de filtres */
.portfolio-albums-filter{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:12px;
  flex-wrap:nowrap;
  margin:8px auto 24px;
}

.album-filter{
  appearance:none;
  -webkit-appearance:none;
  border:1px solid rgba(255,255,255,0.12);
  border-radius:999px;
  padding:7px 15px;
  min-height:32px;
  min-width:96px;
  text-align:center;
  background:rgba(255,255,255,0.02);
  color:rgba(255,255,255,0.64);
  font-family:"Arial Rounded MT";
  font-size:.8rem;
  line-height:1;
  cursor:pointer;
  transition:
    border-color .25s ease,
    color .25s ease,
    background .25s ease,
    transform .25s ease,
    box-shadow .25s ease;
}

.album-filter:hover{
  border-color:rgba(94,193,169,0.42);
  color:#ffffff;
  background:rgba(94,193,169,0.05);
  transform:translateY(-1px);
}

.album-filter.active{
  border-color:rgba(94,193,169,0.70);
  color:#5ec1a9;
  background:rgba(94,193,169,0.08);
  box-shadow:
    0 0 0 1px rgba(94,193,169,0.08),
    0 6px 16px rgba(0,0,0,0.12);
}

/* targeta +n */
.portfolio-photo-more{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:100%;
  aspect-ratio:4 / 3;
  border-radius:24px;
  background:
    linear-gradient(145deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02)),
    rgba(52,73,92,0.72);
  border:1px solid rgba(255,255,255,0.10);
  box-shadow:
    0 16px 40px rgba(0,0,0,0.16),
    0 0 14px rgba(94,193,169,0.05);
  color:#ffffff;
  font-family:"Arial Rounded MT";
  font-size:2rem;
  line-height:1;
  cursor:pointer;
  transition:
    transform .25s ease,
    border-color .25s ease,
    box-shadow .25s ease,
    color .25s ease,
    background .25s ease;
}

.portfolio-photo-more:hover{
  transform:translateY(-2px);
  border-color:rgba(94,193,169,0.42);
  color:#5ec1a9;
  box-shadow:
    0 22px 48px rgba(0,0,0,0.22),
    0 0 16px rgba(94,193,169,0.10);
}

/* línia llarga del primer nivell */
.portfolio-audiovisual-nav{
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:18px;
  margin:40px auto 24px;
}

.portfolio-audiovisual-nav::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  width:min(860px, 88vw);
  height:1px;
  background:linear-gradient(
    90deg,
    transparent 0%,
    rgba(255,255,255,0.14) 12%,
    rgba(255,255,255,0.18) 50%,
    rgba(255,255,255,0.14) 88%,
    transparent 100%
  );
  z-index:0;
}

.portfolio-tab{
  position:relative;
  z-index:1;
}

/* títol de l'àlbum més petit i premium */
.portfolio-album-head h2{
  font-family:"Arial Rounded MT";
  font-size:1.02rem !important;
  line-height:1.2;
  font-weight:400;
  letter-spacing:0.015em;
  color:rgba(255,255,255,0.62);
  margin:0 0 12px;
  position:relative;
}

.portfolio-album-head h2::after{
  content:"";
  display:block;
  width:24px;
  height:1px;
  margin-top:7px;
  background:linear-gradient(
    90deg,
    rgba(94,193,169,0.50),
    rgba(94,193,169,0)
  );
  opacity:.55;
}

/* mòbil */
@media (max-width:768px){
  .portfolio-albums-filter{
    gap:10px;
    flex-wrap:wrap;
    margin:6px auto 20px;
  }

  .album-filter{
    padding:7px 14px;
    min-height:32px;
    min-width:auto;
    font-size:.78rem;
  }

  .portfolio-photo-more{
    font-size:1.7rem;
    border-radius:20px;
  }

  .portfolio-audiovisual-nav::before{
    width:min(260px, 72vw);
  }

  .portfolio-album-head h2{
    font-size:.95rem !important;
    margin-bottom:10px;
  }

  .portfolio-album-head h2::after{
    width:20px;
    margin-top:6px;
  }
}
/* =========================
   FILTRES SECUNDARIS · ULTRA SUBTILS
   ========================= */

.album-filter{
  appearance:none;
  -webkit-appearance:none;
  border:1px solid rgba(255,255,255,0.10);
  border-radius:999px;

  padding:6px 14px;
  min-height:28px;
  min-width:88px;

  text-align:center;

  background:rgba(255,255,255,0.015);
  color:rgba(255,255,255,0.55);

  font-family:"Arial Rounded MT";
  font-size:.74rem;
  line-height:1;

  cursor:pointer;

  transition:
    border-color .25s ease,
    color .25s ease,
    background .25s ease,
    transform .25s ease,
    box-shadow .25s ease;
}

/* hover molt subtil */
.album-filter:hover{
  border-color:rgba(94,193,169,0.35);
  color:rgba(255,255,255,0.85);
  background:rgba(94,193,169,0.04);
  transform:translateY(-1px);
}

/* actiu → elegant, no cridaner */
.album-filter.active{
  border-color:rgba(94,193,169,0.55);
  color:#5ec1a9;
  background:rgba(94,193,169,0.06);
  box-shadow:
    0 0 0 1px rgba(94,193,169,0.06);
}
.portfolio-album-head h2{
  letter-spacing:0.04em;
  text-transform:uppercase;
  font-size:.9rem !important;
  color:rgba(255,255,255,0.55);
}
.portfolio-albums-filter{
  justify-content:flex-start;
  max-width:900px;
  margin:6px auto 16px;
}
/* =========================
   ELIMINAR TÍTOLS D'ÀLBUM (FORÇAT)
   ========================= */

.portfolio-album-head,
.portfolio-album-head h2{
  display:none !important;
}
/* =========================
   LIGHTBOX · BASE CLEAN
   ========================= */

.fancybox__container{
  backdrop-filter:blur(6px);
  background:rgba(10,18,26,0.92);
}

/* eliminar marcs blancs */
.fancybox__content{
  background:none !important;
  box-shadow:none !important;
  border-radius:18px;
  overflow:hidden;
}
/* =========================
   LIGHTBOX FANCYBOX · ESTIL NET I PREMIUM
   només afecta les fotos obertes al lightbox
   ========================= */

/* fons general */
.fancybox-bg{
  background:rgba(18,28,38,0.90) !important;
}

/* contenidors interns */
.fancybox-stage,
.fancybox-slide,
.fancybox-slide--image,
.fancybox-content,
.fancybox-image-wrap{
  background:transparent !important;
  box-shadow:none !important;
}

/* imatge oberta */
.fancybox-image{
  border-radius:18px !important;
  box-shadow:0 18px 50px rgba(0,0,0,0.22) !important;
}

/* barra superior */
.fancybox-toolbar{
  background:transparent !important;
}

/* botons superiors */
.fancybox-toolbar .fancybox-button{
  width:38px !important;
  height:38px !important;
  margin:0 4px !important;
  padding:0 !important;
  border-radius:999px !important;
  background:rgba(255,255,255,0.10) !important;
  border:1px solid rgba(255,255,255,0.14) !important;
  box-shadow:none !important;
  transition:all .22s ease !important;
}

.fancybox-toolbar .fancybox-button:hover{
  background:rgba(255,255,255,0.18) !important;
  border-color:rgba(255,255,255,0.24) !important;
}

/* icones toolbar */
.fancybox-toolbar .fancybox-button svg{
  display:block !important;
  width:16px !important;
  height:16px !important;
  opacity:1 !important;
  visibility:visible !important;
}

.fancybox-toolbar .fancybox-button svg path{
  fill:#ffffff !important;
  stroke:none !important;
}

/* fletxes laterals */
.fancybox-navigation .fancybox-button,
.fancybox-button--arrow_left,
.fancybox-button--arrow_right{
  width:42px !important;
  height:42px !important;
  padding:0 !important;
  border-radius:999px !important;
  background:rgba(255,255,255,0.10) !important;
  border:1px solid rgba(255,255,255,0.14) !important;
  box-shadow:none !important;
  transition:all .22s ease !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

/* hover fletxes */
.fancybox-navigation .fancybox-button:hover,
.fancybox-button--arrow_left:hover,
.fancybox-button--arrow_right:hover{
  background:rgba(255,255,255,0.18) !important;
  border-color:rgba(255,255,255,0.24) !important;
  transform:scale(1.03) !important;
}

/* svg de les fletxes */
.fancybox-navigation .fancybox-button svg,
.fancybox-button--arrow_left svg,
.fancybox-button--arrow_right svg{
  display:block !important;
  width:16px !important;
  height:16px !important;
  opacity:1 !important;
  visibility:visible !important;
}

.fancybox-navigation .fancybox-button svg path,
.fancybox-button--arrow_left svg path,
.fancybox-button--arrow_right svg path{
  fill:#ffffff !important;
  stroke:none !important;
}

/* neteja d'elements sobrers */
.fancybox-infobar,
.fancybox-thumbs{
  display:none !important;
}
/* =========================
   OVERRIDE · CONTROLS PREMIUM
   ========================= */

/* botons superiors */
.fancybox-toolbar .fancybox-button{
  width:44px !important;
  height:44px !important;
  margin:0 6px !important;

  background:rgba(18,28,38,0.72) !important;
  border:1px solid rgba(255,255,255,0.18) !important;
  box-shadow:
    0 10px 24px rgba(0,0,0,0.22),
    0 0 0 1px rgba(255,255,255,0.04) inset !important;

  backdrop-filter:blur(8px) !important;
}

/* hover */
.fancybox-toolbar .fancybox-button:hover{
  background:rgba(18,28,38,0.88) !important;
  border-color:rgba(94,193,169,0.42) !important;
  transform:translateY(-1px) scale(1.03) !important;
}

/* fletxes */
.fancybox-navigation .fancybox-button,
.fancybox-button--arrow_left,
.fancybox-button--arrow_right{
  width:48px !important;
  height:48px !important;

  background:rgba(18,28,38,0.68) !important;
  border:1px solid rgba(255,255,255,0.18) !important;
  box-shadow:
    0 10px 24px rgba(0,0,0,0.22),
    0 0 0 1px rgba(255,255,255,0.04) inset !important;

  backdrop-filter:blur(8px) !important;
}

/* hover fletxes */
.fancybox-navigation .fancybox-button:hover{
  background:rgba(18,28,38,0.86) !important;
  border-color:rgba(94,193,169,0.42) !important;
  transform:scale(1.05) !important;
}

/* separació lateral */
.fancybox-button--arrow_left{
  left:18px !important;
}

.fancybox-button--arrow_right{
  right:18px !important;
}
/* =========================
   LIGHTBOX · CONTROLS PREMIUM FINAL
   ========================= */

/* botons superiors */
.fancybox-toolbar .fancybox-button{
  width:46px !important;
  height:46px !important;
  margin:0 6px !important;
  padding:0 !important;
  border-radius:999px !important;

  background:rgba(24,36,47,0.72) !important;
  border:1px solid rgba(94,193,169,0.42) !important;
  box-shadow:
    0 10px 24px rgba(0,0,0,0.22),
    0 0 0 1px rgba(94,193,169,0.06) inset !important;

  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  transition:
    background .22s ease,
    border-color .22s ease,
    transform .22s ease,
    box-shadow .22s ease !important;
}

.fancybox-toolbar .fancybox-button:hover{
  background:rgba(24,36,47,0.90) !important;
  border-color:rgba(94,193,169,0.72) !important;
  transform:translateY(-1px) scale(1.04) !important;
  box-shadow:
    0 14px 30px rgba(0,0,0,0.28),
    0 0 0 1px rgba(94,193,169,0.10) inset !important;
}

/* icones superiors més grans */
.fancybox-toolbar .fancybox-button svg{
  display:block !important;
  width:20px !important;
  height:20px !important;
  opacity:1 !important;
  visibility:visible !important;
}

.fancybox-toolbar .fancybox-button svg path{
  fill:#ffffff !important;
  stroke:#ffffff !important;
  stroke-width:0 !important;
}

/* fletxes laterals */
.fancybox-navigation .fancybox-button,
.fancybox-button--arrow_left,
.fancybox-button--arrow_right{
  width:50px !important;
  height:50px !important;
  padding:0 !important;
  border-radius:999px !important;

  background:rgba(24,36,47,0.72) !important;
  border:1px solid rgba(94,193,169,0.42) !important;
  box-shadow:
    0 10px 24px rgba(0,0,0,0.22),
    0 0 0 1px rgba(94,193,169,0.06) inset !important;

  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  transition:
    background .22s ease,
    border-color .22s ease,
    transform .22s ease,
    box-shadow .22s ease !important;
}

.fancybox-navigation .fancybox-button:hover,
.fancybox-button--arrow_left:hover,
.fancybox-button--arrow_right:hover{
  background:rgba(24,36,47,0.90) !important;
  border-color:rgba(94,193,169,0.72) !important;
  transform:scale(1.05) !important;
  box-shadow:
    0 14px 30px rgba(0,0,0,0.28),
    0 0 0 1px rgba(94,193,169,0.10) inset !important;
}

/* icones fletxes més grans */
.fancybox-navigation .fancybox-button svg,
.fancybox-button--arrow_left svg,
.fancybox-button--arrow_right svg{
  display:block !important;
  width:20px !important;
  height:20px !important;
  opacity:1 !important;
  visibility:visible !important;
}

.fancybox-navigation .fancybox-button svg path,
.fancybox-button--arrow_left svg path,
.fancybox-button--arrow_right svg path{
  fill:#ffffff !important;
  stroke:#ffffff !important;
  stroke-width:0 !important;
}

/* separació lateral */
.fancybox-button--arrow_left{
  left:18px !important;
}

.fancybox-button--arrow_right{
  right:18px !important;
}

/* barra superior de progrés del slideshow / autoplay */
.fancybox-progress{
  background:#f3b03f !important;
  height:3px !important;
  opacity:1 !important;
}
/* eliminar botó grid / thumbnails */
.fancybox-button--thumbs,
.fancybox__button--thumbs{
  display:none !important;
}
/* forçar toolbar en horitzontal */
.fancybox-toolbar{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:8px !important;
}

/* evitar stacking vertical */
.fancybox-toolbar > *{
  flex:0 0 auto !important;
}
/* separar de la vora */
.fancybox-toolbar{
  top:18px !important;
  right:18px !important;
  left:auto !important;
}
/* fallback definitiu */
.fancybox-toolbar .fancybox-button:nth-of-type(3){
  display:none !important;
}
/* =========================
   LIGHTBOX · ESTÈTICA MARCA
   ========================= */

/* fons amb efecte vidre blau */
.fancybox-bg{
  background:rgba(34,53,69,0.78) !important;
  backdrop-filter:blur(12px) saturate(120%) !important;
  -webkit-backdrop-filter:blur(12px) saturate(120%) !important;
}

/* capa extra per donar profunditat */
.fancybox-bg::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(
    circle at center,
    rgba(94,193,169,0.06),
    rgba(0,0,0,0.25)
  );
  pointer-events:none;
}

/* imatge amb marc corporatiu */
.fancybox-image{
  border-radius:18px !important;

  /* marc verd subtil */
  border:1px solid rgba(94,193,169,0.35) !important;

  /* glow molt fi */
  box-shadow:
    0 20px 60px rgba(0,0,0,0.35),
    0 0 0 1px rgba(94,193,169,0.08),
    0 0 24px rgba(94,193,169,0.08) !important;
}

/* hover lleuger (només si mous el cursor sobre la imatge) */
.fancybox-slide--image:hover .fancybox-image{
  border-color:rgba(94,193,169,0.55) !important;
  box-shadow:
    0 24px 70px rgba(0,0,0,0.40),
    0 0 0 1px rgba(94,193,169,0.12),
    0 0 32px rgba(94,193,169,0.12) !important;
}
/* =========================
   ÀLBUMS · TRANSICIONS PREMIUM
   ========================= */

/* bloc d'àlbum */
.portfolio-album-block{
  opacity:1;
  transform:translateY(0);
  transition:
    opacity .38s ease,
    transform .38s ease;
}

/* estat ocult en canvi de filtre */
.portfolio-album-block.is-leaving{
  opacity:0;
  transform:translateY(14px);
  pointer-events:none;
}

/* estat entrant */
.portfolio-album-block.is-entering{
  opacity:0;
  transform:translateY(14px);
}

/* galeria */
.portfolio-album-gallery{
  position:relative;
}

/* fotos */
.portfolio-photo-item{
  opacity:1;
  transform:translateY(0) scale(1);
  transition:
    opacity .34s ease,
    transform .34s ease,
    box-shadow .28s ease;
}

/* fotos inicialment ocultes */
.portfolio-photo-item.is-hidden{
  display:none !important;
}

/* fotos que apareixen amb el + */
.portfolio-photo-item.is-revealing{
  display:block !important;
  opacity:0;
  transform:translateY(18px) scale(.985);
}

/* targeta +n */
.portfolio-photo-more{
  opacity:1;
  transform:translateY(0);
  transition:
    opacity .28s ease,
    transform .28s ease,
    background .25s ease,
    box-shadow .25s ease;
}

.portfolio-photo-more.is-removing{
  opacity:0;
  transform:translateY(10px) scale(.98);
  pointer-events:none;
}
/* =====================================
   HERO LOGO · CONTROL DEFINITIU
   ===================================== */

/* base (desktop coherent) */
.home-hero .hero-logo{
  width:clamp(180px, 16vw, 300px) !important;
  margin:0 auto 22px !important;
  display:flex;
  justify-content:center;
}

.home-hero .hero-logo img{
  width:100% !important;
  height:auto !important;
  display:block;
}


/* =========================
   HERO MÒBIL · LOGO + SUBTÍTOL
   ========================= */
@media (max-width:768px){

  .home-hero{
    padding-top:40px !important;
  }

  .home-hero .hero-logo{
    width:200px !important;
    max-width:68vw !important;
    margin:0 auto 18px !important;
  }

  .home-hero .hero-logo img{
    width:100% !important;
  }

  .hero-rotating-subtitle{
    width:100% !important;
    max-width:none !important;
  }

  .hero-rotating-line{
    position:absolute !important;
    left:50% !important;
    transform:translateX(-50%) translateY(14px) !important;
    width:auto !important;
    max-width:none !important;
    white-space:nowrap !important;
    text-align:center !important;
    line-height:1.25 !important;
  }

  .hero-rotating-line.is-active{
    transform:translateX(-50%) translateY(0) !important;
  }

}
/* espai lateral carrusel audiovisual */
@media (max-width:768px){

  .clients-premium,
  .clients-premium .swiper,
  .clients-premium .swiper-wrapper{
    padding-left:16px !important;
    padding-right:16px !important;
  }

  .client-premium-card{
    border-radius:18px !important;
  }

}
/* PÀGINA AUDIOVISUAL MÒBIL · donar aire lateral real */
@media (max-width:768px){

  .page-id-376 .portfolio-video-slider,
  .page-id-376 .portfolio-reels-slider,
  .page-id-376 .portfolio-audiovisual-page .container{
    width:calc(100% - 32px) !important;
    max-width:none !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .page-id-376 .portfolio-video-card,
  .page-id-376 .portfolio-video-media{
    width:100% !important;
    max-width:none !important;
  }

}
/* PAGE 376 · REELS MÒBIL NET */
@media (max-width:768px){

  .page-id-376 .portfolio-panel[data-panel="reels"] .reel-item{
    display:none !important;
    height:auto !important;
  }

  .page-id-376 .portfolio-panel[data-panel="reels"] .reel-item.is-active{
    display:flex !important;
    justify-content:center !important;
    align-items:flex-start !important;
    width:100% !important;
    height:auto !important;
  }

  .page-id-376 .portfolio-panel[data-panel="reels"] .reel-media{
    width:58vw !important;
    max-width:220px !important;
    aspect-ratio:9 / 16 !important;
    height:auto !important;
    max-height:none !important;
    margin:0 auto !important;
    flex:0 0 auto !important;
  }

  .page-id-376 .portfolio-panel[data-panel="reels"] .reel-media video,
  .page-id-376 .portfolio-panel[data-panel="reels"] .reel-media iframe{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    display:block !important;
  }

}
@media (max-width:768px){

  .page-id-376 .reel-nav{
    width:20px !important;
    height:20px !important;
    padding:0 !important;
  }

  .page-id-376 .reel-nav svg{
    width:12px !important;
    height:12px !important;
  }

}
@media (max-width:768px){

  .page-id-376 .reel-item button,
  .page-id-376 .reel-item .swiper-button-next,
  .page-id-376 .reel-item .swiper-button-prev{
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    min-height:32px !important;
    padding:0 !important;
  }

  .page-id-376 .reel-item button svg,
  .page-id-376 .reel-item .swiper-button-next svg,
  .page-id-376 .reel-item .swiper-button-prev svg{
    width:12px !important;
    height:12px !important;
  }

}
@media (max-width:768px){

  .page-id-376 .swiper-button-prev{
    opacity:0 !important;
    pointer-events:none !important;
  }

}
@media (max-width:768px){

  .page-id-376 .reel-arrow:first-child,
  .page-id-376 .reel-arrows button:first-child,
  .page-id-376 .portfolio-reels-slider .reel-arrow:first-child,
  .page-id-376 .portfolio-reels-slider .reel-arrows button:first-child{
    display:none !important;
  }

}
@media (max-width:768px){

  /* CONTENIDOR GENERAL (més aire als costats) */
  .page-id-376 .portfolio-panel[data-panel="fotografia"]{
    padding-left:20px !important;
    padding-right:20px !important;
  }

  /* GRID */
  .page-id-376 .portfolio-grid{
    display:grid !important;
    grid-template-columns:repeat(2, 1fr) !important;
    gap:10px !important; /* ↓ menys espai entre fotos */
  }

  /* ITEMS */
  .page-id-376 .portfolio-item{
    margin:0 !important;
  }

}
@media (max-width:768px){

  /* CONTENIDOR SUBMENÚ */
  .page-id-376 .portfolio-subfilters{
    display:flex !important;
    justify-content:center !important;
    gap:8px !important;
    margin-top:10px !important;
  }

  /* BOTONS SUBMENÚ */
  .page-id-376 .portfolio-subfilters .filter-btn{
    font-size:13px !important;
    padding:6px 12px !important;
    border-radius:20px !important;
    line-height:1 !important;
  }

}
/* PAGE 376 · pujar hero cap amunt */
.page-id-376 .portfolio-panel{
  padding-top:20px !important; /* abans segurament 60–100px */
}

/* línia decorativa */
.page-id-376 .portfolio-divider{
  margin-top:10px !important;
  margin-bottom:20px !important;
}

/* LOGO */
.page-id-376 .portfolio-logo{
  margin-top:10px !important;
  margin-bottom:20px !important;
}

/* TABS (Videos / Reels / Fotografia) */
.page-id-376 .portfolio-tabs{
  margin-top:10px !important;
}
/* PAGE 376 · PUJAR TOT EL BLOC SUPERIOR */
.page-id-376 .portfolio-audiovisual-header{
  margin:28px auto 0 !important;
}

.page-id-376 .portfolio-audiovisual-nav{
  margin:12px auto 22px !important;
}

.page-id-376 .portfolio-video-slider,
.page-id-376 .portfolio-reels-slider,
.page-id-376 .portfolio-albums-wrap{
  margin-top:0 !important;
}

.page-id-376 .portfolio-panel.is-active{
  padding-top:0 !important;
}

.page-id-376 .portfolio-audiovisual-page{
  padding-top:0 !important;
  transform:translateY(-36px) !important;
}
/* PAGE 376 · PUJAR MENÚ I BLOC DE CONTINGUT */
/* PAGE 376 · PUJAR MENÚ I BLOC DE CONTINGUT */
.page-id-376 .mm-premium-menu{
  top: 28px !important;
}

.page-id-376 .portfolio-audiovisual-nav{
  margin-top: -26px !important;
}

.page-id-376 .portfolio-albums-filter{
  margin-top: -8px !important;
}

.page-id-376 .portfolio-albums-wrap,
.page-id-376 .portfolio-video-slider,
.page-id-376 .portfolio-reels-slider{
  margin-top: -12px !important;
}
/* PAGE 376 · eliminar línia duplicada */
.page-id-376 .portfolio-divider{
  display:none !important;
}
/* PAGE 376 · deixar només una línia darrere dels tabs */
.page-id-376 .portfolio-audiovisual-nav::before{
  display:block !important;
}

.page-id-376 .portfolio-reels-slider::before,
.page-id-376 .portfolio-video-slider::before,
.page-id-376 .portfolio-albums-wrap::before,
.page-id-376 .portfolio-panel::before{
  display:none !important;
  content:none !important;
}
/* PAGE 376 · deixar només una línia darrere dels tabs */
.page-id-376 .portfolio-audiovisual-nav::before{
  display:block !important;
}

.page-id-376 .portfolio-reels-slider::before,
.page-id-376 .portfolio-video-slider::before,
.page-id-376 .portfolio-albums-wrap::before,
.page-id-376 .portfolio-panel::before{
  display:none !important;
  content:none !important;
}
/* PAGE 376 · aire entre submenú i fotos */
.page-id-376 .portfolio-albums-filter{
  margin-bottom:18px !important;
}

/* opcional: ajustar també el grid per coherència */
.page-id-376 .portfolio-albums-wrap{
  margin-top:0 !important;
}
/* PAGE 376 · controls centrats sota MENU */
.page-id-376 .audiovisual-controls{
  position:absolute !important;
  left:50% !important;
  top:120px !important; /* ajusta això */
  transform:translateX(-50%) !important;

  display:flex !important;
  justify-content:center !important;
  gap:16px;
  z-index:5;
}
.page-id-376 .top-home{
  position:relative;
}
/* PAGE 376 · controls superiors centrats i més avall */
.page-id-376 .audiovisual-controls{
  position: fixed !important;
  top: 110px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  right: auto !important;
  bottom: auto !important;

  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 14px !important;
  z-index: 99999 !important;
  margin: 0 !important;
}
/* PAGE 376 · eliminar controls fancybox en mòbil */
@media (max-width:768px){
  .fancybox-toolbar{
    display:none !important;
  }
}
/* PAGE 376 · baixar reel en mòbil */
@media (max-width:768px){
  .page-id-376 .portfolio-reel,
  .page-id-376 .portfolio-video,
  .page-id-376 .portfolio-item{
    margin-top:24px !important;
  }
}
/* PAGE 376 · vídeo més gran + més aire */
@media (max-width:768px){

  /* baixar el vídeo */
  .page-id-376 .portfolio-video,
  .page-id-376 .portfolio-reel{
    margin-top:28px !important;
  }

  /* fer-lo més gran (reduir marges laterals) */
  .page-id-376 .portfolio-video,
  .page-id-376 .portfolio-reel{
    width:calc(100% - 24px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

}
/* PAGE 376 · només fletxa dreta + més petita */
@media (max-width:768px){

  /* amagar fletxa esquerra */
  .page-id-376 .portfolio-video .swiper-button-prev{
    display:none !important;
  }

  /* fer més petita la dreta */
  .page-id-376 .portfolio-video .swiper-button-next{
    width:36px !important;
    height:36px !important;
  }

  /* icona més petita dins */
  .page-id-376 .portfolio-video .swiper-button-next::after{
    font-size:14px !important;
  }

}
@media (max-width:768px){

  [class*="video"] .swiper-button-prev{
    display:none !important;
  }

  [class*="video"] .swiper-button-next{
    width:36px !important;
    height:36px !important;
  }

  [class*="video"] .swiper-button-next::after{
    font-size:14px !important;
  }

}
/* PAGE 376 · VIDEO MÒBIL · només fletxa dreta */
@media (max-width:768px){

  .page-id-376 .portfolio-video-arrows{
    right:16px !important;
    bottom:16px !important;
    gap:0 !important;
  }

  .page-id-376 .portfolio-video-arrow{
    width:34px !important;
    height:34px !important;
    min-width:34px !important;
    min-height:34px !important;
    font-size:14px !important;
    padding:0 !important;
  }

  .page-id-376 .portfolio-video-arrow:first-child{
    display:none !important;
  }

  .page-id-376 .portfolio-video-arrow:last-child{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }

  .page-id-376 .portfolio-video-arrow:last-child svg{
    width:12px !important;
    height:12px !important;
  }
}
@media (max-width:768px){
  .page-id-376 [class*="reel"]{
    margin-top:40px !important;
  }
}
/* LOGO clickable feedback només a la 376 */
.page-id-376 .logo{
  cursor:pointer;
  transition:transform .2s ease, opacity .2s ease;
}

.page-id-376 .logo:hover{
  transform:scale(0.96);
  opacity:0.9;
}
.page-id-376 .portfolio-audiovisual-logo-link{
  display:inline-block;
  text-decoration:none;
  cursor:pointer;
}
/* CURSOR SEMPRE A SOBRE */

html body .cursor-m,
html body .cursor-light-home,
html body .cursor-glow{
  position:fixed !important;
  z-index:2147483647 !important;
  pointer-events:none !important;
}
/* =====================================
   HERO HOME · CODI NET
   Desktop intacte + mòbil simplificat
   ===================================== */

/* FONS */
.home-hero-media{
  position:absolute !important;
  inset:0 !important;
  background-image:url('http://millennialsturisme.cat/wp-content/uploads/2026/03/delta-ebre-2-scaled.jpg') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}

/* CONTINGUT HERO · BASE / DESKTOP */
.home-hero-content{
  position:absolute !important;
  left:72px !important;
  bottom:170px !important;
  width:min(640px, 48vw) !important;
  max-width:none !important;
  margin:0 !important;
  text-align:left !important;
  transform:none !important;
}

.home-hero-content p{
  margin:0 !important;
}

/* ETIQUETA */
.hero-eyebrow{
  display:block !important;
  margin:0 0 14px 0 !important;
  color:#d4a85a !important;
  font-size:13px !important;
  line-height:1.15 !important;
  letter-spacing:1.6px !important;
  text-transform:uppercase !important;
  font-weight:500 !important;
  white-space:nowrap !important;
}

.hero-eyebrow .eyebrow-line-1,
.hero-eyebrow .eyebrow-line-2{
  display:inline !important;
}

.hero-eyebrow .eyebrow-line-1::after{
  content:" " !important;
}

/* TÍTOL */
.home-hero-content h1{
  margin:0 0 14px 0 !important;
  max-width:620px !important;
  font-size:clamp(30px, 3vw, 46px) !important;
  line-height:1.1 !important;
}

/* SUBTÍTOL */
.hero-rotating-subtitle{
  width:auto !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  text-align:left !important;
}

.hero-rotating-line{
  display:block !important;
  white-space:nowrap !important;
  color:#f3b03f !important;
  font-size:clamp(1rem, 1.1vw, 1.15rem) !important;
  line-height:1.28 !important;
  letter-spacing:0.1px !important;
}

.mobile-break{
  display:none !important;
}

/* =====================================
   DESKTOP · TAL COM FUNCIONA ARA
   ===================================== */
@media (min-width:769px){

  body.home .home-hero-content{
    bottom:100px !important;
    gap:0 !important;
  }

  body.home .hero-eyebrow,
  body.home .home-hero-content h1{
    position:static !important;
    top:auto !important;
    transform:none !important;
  }

  body.home .hero-eyebrow{
    display:inline-block !important;
    width:max-content !important;
    max-width:none !important;
    white-space:nowrap !important;
    margin:0 !important;
    letter-spacing:1.8px !important;
    opacity:0.9 !important;
  }

  body.home .hero-eyebrow .eyebrow-line-1,
  body.home .hero-eyebrow .eyebrow-line-2{
    display:inline !important;
  }

  body.home .hero-eyebrow .eyebrow-line-1::after{
    content:" " !important;
  }

  body.home .hero-eyebrow br{
    display:none !important;
  }

  body.home .home-hero-content h1{
    margin-top:-52px !important;
    margin-bottom:10px !important;
  }

  body.home .hero-rotating-subtitle{
    margin:0 !important;
  }

  body.home .hero-rotating-line{
    opacity:0.85 !important;
  }
}

/* =====================================
   MÒBIL · ÚNIC BLOC NET
   ===================================== */
@media (max-width:768px){

  body.home .home-hero-media{
    background-image:url('http://millennialsturisme.cat/wp-content/uploads/2026/03/heromillennials-scaled.jpg') !important;
    background-position:center center !important;
  }

  body.home .home-hero{
    padding-top:40px !important;
  }

  body.home .home-hero .hero-logo{
    width:190px !important;
    max-width:62vw !important;
    margin:0 auto 18px !important;
    display:flex !important;
    justify-content:center !important;
  }

  body.home .home-hero .hero-logo img{
    width:100% !important;
    height:auto !important;
    display:block !important;
  }

/* CONTENIDOR CENTRAL REAL */
body.home .home-hero-content{
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  bottom:180px !important;
  margin:0 auto !important;
  width:calc(100% - 42px) !important;
  max-width:360px !important;
  text-align:center !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  transform:none !important;
}

/* ETIQUETA */
body.home .hero-eyebrow{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  width:max-content !important;
  max-width:none !important;
  margin:0 0 8px 0 !important;
  color:#E6B85C !important;
  font-size:10px !important;
  line-height:0.95 !important;
  letter-spacing:1.15px !important;
  white-space:normal !important;
  text-align:center !important;
  position:static !important;
  left:auto !important;
  top:auto !important;
  transform:none !important;
  text-shadow:0 1px 6px rgba(0,0,0,0.35) !important;
  opacity:1 !important;
}

body.home .hero-eyebrow .eyebrow-line-1,
body.home .hero-eyebrow .eyebrow-line-2{
  display:block !important;
  width:auto !important;
  margin:0 !important;
  padding:0 !important;
  line-height:0.95 !important;
  text-align:center !important;
}

body.home .hero-eyebrow .eyebrow-line-1::after{
  content:none !important;
}

body.home .hero-eyebrow .eyebrow-line-2{
  margin-top:-2px !important;
}

/* TÍTOL */
body.home .home-hero-content h1{
  margin:0 0 0 0 !important;
  font-size:1.35rem !important;
  line-height:1.1 !important;
  text-align:center !important;
}

/* SUBTÍTOL */
body.home .hero-rotating-subtitle{
  width:100% !important;
  max-width:none !important;
  margin:-40px auto 0 auto !important;
  padding:0 !important;
  text-align:center !important;
  position:static !important;
  top:auto !important;
}

body.home .hero-rotating-line{
  display:block !important;
  width:100% !important;
  max-width:none !important;
  white-space:normal !important;
  text-align:center !important;
  font-size:0.9rem !important;
  line-height:1.25 !important;
  margin:0 !important;
  opacity:0.95 !important;
}

body.home .mobile-break{
  display:block !important;
}