/**
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;
  }
}

/** NOU **/
#ast-scroll-top {
  width: 50px;
  height: 50px;
  border-radius: 100%;
  font-size: 22px;
}

#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);
}

/* carta del darrere només a vídeos */

body.page-id-329 .audiovisual-videos .audiovisual-slide{
  backface-visibility:hidden !important;
  -webkit-backface-visibility:hidden !important;
}

body.page-id-329 .audiovisual-videos .audiovisual-slide.active{
  z-index:3 !important;
  opacity:1 !important;
  visibility:visible !important;
}

body.page-id-329 .audiovisual-videos .audiovisual-slide.is-next{
  opacity:.14 !important;
  visibility:visible !important;
  pointer-events:none !important;
  z-index:2 !important;
  transform:translateY(-20px) translateX(28px) scale(.985) !important;
}

body.page-id-329 .audiovisual-videos .audiovisual-slide.is-next .video-caption{
  opacity:0 !important;
}

body.page-id-329 .audiovisual-videos .audiovisual-slide.is-next .video-item{
  box-shadow:
    0 14px 30px rgba(0,0,0,0.10),
    0 6px 14px rgba(0,0,0,0.05) !important;
}
/* REELS */

.reel-layout{
  width:min(900px, calc(100vw - 120px));
  max-width:900px;
  margin:0 auto;
  min-height:calc(100vh - 170px);
  padding-top:80px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:90px;
}

.reel-phone{
  position:relative;
  flex:0 0 300px;
  width:300px;
  border-radius:38px;
  background:#111820;
  padding:14px;
  box-shadow:
    0 24px 60px rgba(0,0,0,0.24),
    0 10px 24px rgba(0,0,0,0.16);
  overflow:hidden !important;
}

.reel-phone::after{
  content:"";
  position:absolute;
  left:10%;
  right:10%;
  bottom:-18px;
  height:42px;
  background:radial-gradient(ellipse at center, rgba(0,0,0,0.24) 0%, rgba(0,0,0,0.06) 55%, rgba(0,0,0,0) 80%);
  pointer-events:none;
  z-index:-1;
}

.reel-phone::before{
  content:"";
  position:absolute;
  top:12px;
  left:50%;
  transform:translateX(-50%);
  width:92px;
  height:14px;
  border-radius:999px;
  background:#070c11;
  z-index:3;
}

.reel-phone video{
  width:100% !important;
  display:block !important;
  aspect-ratio:9 / 19.5;
  object-fit:cover !important;
  object-position:center top !important;
  border-radius:24px;
  background:#000;
  max-width:none !important;
  height:auto !important;
  transform:none !important;
}

.reel-info{
  flex:0 0 340px;
  max-width:340px;
  text-align:left;
}

.reel-info h2{
  margin:0 0 12px;
  font-family:"Arial Rounded MT";
  font-size:2.35rem;
  line-height:1.02;
  color:#ffffff;
}

.reel-info p{
  margin:0;
  font-size:1.02rem;
  line-height:1.6;
  color:rgba(255,255,255,0.76);
}
.reel-counter{
  font-family:"Varela Round", sans-serif;
  font-size:13px;
  letter-spacing:2px;
  color:rgba(255,255,255,0.75);
  margin-bottom:18px;

  display:flex;
  align-items:center;
  gap:6px;
}

.reel-counter::before{
  content:"";
  width:16px;
  height:1px;
  background:rgba(243,176,63,0.55);
  display:block;
  margin-right:8px;
}

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

.reel-divider{
  opacity:.55;
}

.reel-total{
  opacity:.55;
}

/* REELS NETS: sense moviment estrany del contenidor */
body.page-id-329 .audiovisual-reels .audiovisual-slide,
body.page-id-329 .audiovisual-reels .audiovisual-slide.active{
  transform:none !important;
  transition:opacity .35s ease, visibility .35s ease !important;
}

body.page-id-329 .audiovisual-reels .reel-layout,
body.page-id-329 .audiovisual-reels .reel-phone,
body.page-id-329 .audiovisual-reels .reel-info{
  transform:none !important;
}

/* 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%
  );
}

/* PÀGINA 329 */

body.page-id-329{
  overflow:hidden;
}

body.page-id-329 #primary{
  min-height:100vh;
}

body.page-id-329 .audiovisual-page{
  height:100vh;
  min-height:100vh;
  padding:170px 0 40px !important;
  overflow:visible !important;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  position:relative !important;
}

body.page-id-329 .audiovisual-page::before{
  content:none !important;
  display:none !important;
}

body.page-id-329 .audiovisual-track{
  height:100%;
  min-height:0;
}

body.page-id-329 .video-stage,
body.page-id-329 .photo-stage{
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

body.page-id-329 .audiovisual-videos .video-stage{
  margin-top:-180px !important;
}

body.page-id-329 .audiovisual-reels .reel-layout{
  margin-top:-180px !important;
}

body.page-id-329 .top-home{
  display:none;
}

/* controls */

body.page-id-329 .audiovisual-controls{
  position:absolute !important;
  left:50% !important;
  top:62% !important;
  transform:translateX(-50%) !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:14px !important;
  z-index:9999 !important;
}

body.page-id-329 .audiovisual-reels.active ~ .audiovisual-controls{
  left:56% !important;
  transform:translateX(-50%);
}

body.page-id-329 .audiovisual-photos.active ~ .audiovisual-controls{
  left:63% !important;
  top:38% !important;
  transform:none !important;
}

/* només una fletxa en fotografia */

body.page-id-329 .audiovisual-photos.active ~ .audiovisual-controls .audiovisual-prev{
  display:none !important;
}

body.page-id-329 .audiovisual-photos.active ~ .audiovisual-controls .audiovisual-next{
  width:28px !important;
  height:29px !important;
  font-size:13px !important;
}

/* RESPONSIVE */

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

@media (max-width: 980px){
  .reel-layout{
    width:min(360px, calc(100vw - 40px));
    max-width:360px;
    min-height:auto;
    flex-direction:column;
    gap:22px;
    text-align:center;
    padding-top:30px;
  }

  .reel-phone{
    flex:0 0 auto;
    width:260px;
    border-radius:30px;
    padding:11px;
  }

  .reel-phone::before{
    width:74px;
    height:11px;
    top:10px;
  }

  .reel-phone video{
    border-radius:18px;
  }

  .reel-info{
    flex:0 0 auto;
    max-width:none;
    text-align:center;
    transform:none !important;
  }

  .reel-info h2{
    font-size:1.8rem;
  }

  .reel-info p{
    font-size:.95rem;
  }

  body.page-id-329 .audiovisual-reels .reel-layout{
    margin-top:-80px !important;
  }
}

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

  body.page-id-329 .audiovisual-page{
    padding:120px 0 50px !important;
  }

  body.page-id-329 .audiovisual-page::before{
    top:32px;
    width:220px;
    height:95px;
  }

  .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;
  }

  body.page-id-329 .audiovisual-videos .video-stage{
    margin-top:-70px !important;
  }

  body.page-id-329 .audiovisual-controls{
    top:auto !important;
    bottom:28px !important;
  }

  body.page-id-329 .audiovisual-reels.active ~ .audiovisual-controls{
    left:50% !important;
  }
}

@media (min-width: 981px){
  body.page-id-329 .audiovisual-reels .audiovisual-slide.active{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:calc(100vh - 170px) !important;
  }

  body.page-id-329 .audiovisual-reels .reel-layout{
    display:grid !important;
    grid-template-columns:300px 340px !important;
    column-gap:72px !important;
    align-items:center !important;
    justify-content:center !important;
    width:760px !important;
    max-width:760px !important;
    padding-top:120px !important;
    min-height:auto !important;
  }

  body.page-id-329 .audiovisual-reels .reel-phone{
    width:300px !important;
    flex:none !important;
    margin:0 !important;
    justify-self:center !important;
  }

  body.page-id-329 .audiovisual-reels .reel-info{
    width:320px !important;
    max-width:320px !important;
    margin:0 !important;
    padding:0 !important;
    text-align:left !important;
    justify-self:start !important;
    align-self:center !important;
    margin-top:-150px !important;
  }

  body.page-id-329 .audiovisual-reels .reel-info h2{
    margin:0 0 10px 0 !important;
    font-size:2.1rem !important;
    line-height:1.02 !important;
  }

  body.page-id-329 .audiovisual-reels .reel-info p{
    margin:0 !important;
  }
}
/* TREURE ANIMACIÓ ALS REELS */

body.page-id-329 .audiovisual-reels .audiovisual-slide,
body.page-id-329 .audiovisual-reels .audiovisual-slide.active{
  transform:none !important;
  transition:opacity 1.5s ease !important;
}

body.page-id-329 .audiovisual-reels .reel-layout,
body.page-id-329 .audiovisual-reels .reel-phone,
body.page-id-329 .audiovisual-reels .reel-info{
  transform:none !important;
}
/* =========================
   FOTOGRAFIA PREMIUM
   pàgina 329
   ========================= */

.photo-stage{
  width:100% !important;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}

.photo-album{
  width:min(1180px, calc(100vw - 120px));
  margin:-240px auto 0 auto;
  display:grid;
  grid-template-columns:minmax(0, 760px) 320px;
  grid-template-rows:auto 1fr;
  column-gap:48px;
  row-gap:24px;
  align-items:start;
}

.photo-main{
grid-column:1 / 2;
grid-row:1 / 2;
position:relative;
border-radius:28px;
overflow:hidden;
background:#182633;
box-shadow:
 0 28px 70px rgba(0,0,0,0.22),
 0 14px 28px rgba(0,0,0,0.12);
aspect-ratio:3 / 2;

max-width:900px;
margin-top:40px;
}

.photo-main img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
}

.photo-main::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    to bottom,
    rgba(34,53,69,0.06) 0%,
    rgba(34,53,69,0.00) 30%,
    rgba(34,53,69,0.10) 70%,
    rgba(34,53,69,0.22) 100%
  );
  pointer-events:none;
}

.photo-meta{
  grid-column:2 / 3;
  grid-row:1 / 2;
  align-self:start;
  padding-top:40px;
}

.photo-counter{
  font-family:"Varela Round", sans-serif;
  font-size:13px;
  letter-spacing:2px;
  color:rgba(255,255,255,0.75);
  margin-bottom:18px;
  display:flex;
  align-items:center;
  gap:6px;
}

.photo-counter::before{
  content:"";
  width:16px;
  height:1px;
  background:rgba(243,176,63,0.55);
  display:block;
  margin-right:8px;
}

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

.photo-divider,
.photo-total{
  opacity:.55;
}

.photo-title{
  margin:0 0 10px 0;
  font-family:"Arial Rounded MT";
  font-size:2.2rem;
  line-height:1.02;
  color:#ffffff;
}

.photo-subtitle{
  margin:0;
  font-size:1rem;
  line-height:1.55;
  color:rgba(255,255,255,0.72);
  max-width:280px;
}

.photo-stack{
  grid-column:2 / 3;
  grid-row:1 / 2;
  position:relative;
  align-self:start;
  margin-top:200px;
  height:240px;
  max-width:300px;
}

.photo-card{
  position:absolute;
  width:100%;
  max-width:240px;
  right:0;
  border-radius:22px;
  overflow:hidden;
  background:#1b2a37;
  box-shadow: 0 22px 48px rgba(0,0,0,0.22), 0 10px 22px rgba(0,0,0,0.12);
  transition:transform .45s ease, opacity .45s ease;
}

.photo-card img{
  width:100%;
  display:block;
  aspect-ratio:4 / 5;
  object-fit:cover;
  object-position:center center;
}

.photo-card-1{
  top:0;
  right:0;
  transform:rotate(-2deg);
  z-index:3;
}

.photo-card-2{
  top:38px;
  right:22px;
  opacity:.82;
  transform:rotate(2.5deg);
  z-index:2;
}

.photo-card-3{
  top:82px;
  right:44px;
  opacity:.58;
  transform:rotate(-1.5deg);
  z-index:1;
}
.photo-card:hover{
  transform: translateY(-4px) rotate(-1deg);
}
body.page-id-329 .audiovisual-photos .audiovisual-slide,
body.page-id-329 .audiovisual-photos .audiovisual-slide.active{
  transform:none !important;
  transition:opacity .6s ease, visibility .6s ease !important;
}

@media (max-width: 980px){
  .photo-album{
  width:min(1180px, calc(100vw - 120px));
  margin:-90px auto 0 auto;
  display:grid;
  grid-template-columns:minmax(0, 760px) 320px;
  grid-template-rows:auto 1fr;
  column-gap:48px;
  row-gap:24px;
  align-items:start;
}

  .photo-main{
grid-column:1 / 2;
grid-row:1 / 2;
position:relative;
border-radius:28px;
overflow:hidden;
background:#182633;
box-shadow:
 0 28px 70px rgba(0,0,0,0.22),
 0 14px 28px rgba(0,0,0,0.12);
aspect-ratio:3 / 2;
max-width:900px;
margin-top:110px;
}

  .photo-meta{
  grid-column:2 / 3;
  grid-row:1 / 2;
  align-self:start;
  padding-top:40px;
}

  .photo-subtitle{
    max-width:none;
  }

  .photo-counter{
    justify-content:center;
  }

 .photo-stack{
  grid-column:2 / 3;
  grid-row:1 / 2;
  position:relative;
  align-self:start;
  margin-top:180px;
  height:290px;
  max-width:340px;
}

  .photo-card{
    max-width:220px;
    left:50%;
    right:auto;
    transform-origin:center center;
  }

  .photo-card-1{
    top:0;
    transform:translateX(-50%) rotate(-2deg);
  }

  .photo-card-2{
    top:26px;
    transform:translateX(-42%) rotate(2deg);
  }

  .photo-card-3{
    top:52px;
    transform:translateX(-34%) rotate(-1.5deg);
  }
}

@media (max-width: 768px){
  .photo-album{
    width:calc(100vw - 32px);
    row-gap:18px;
  }

  .photo-main{
    border-radius:22px;
  }

  .photo-title{
    font-size:1.85rem;
  }

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

  .photo-stack{
    height:190px;
  }

  .photo-card{
    max-width:190px;
    border-radius:18px;
  }
}
.photo-card{
  border:none;
  padding:0;
  cursor:pointer;
}
.photo-main img{
  transition:opacity .75s ease, transform .75s ease;
}

.photo-main img.photo-changing{
  opacity:0;
  transform:scale(1.02);
}
/* recuperar estil original de les fletxes */

body.page-id-329 .audiovisual-control{
  appearance:none !important;
  -webkit-appearance:none !important;
  width:36px !important;
  height:36px !important;
  padding:0 !important;
  border-radius:999px !important;
  border:1px solid rgba(243,176,63,0.35) !important;
  background:rgba(243,176,63,0.18) !important;
  color:#ffffff !important;
  font-size:15px !important;
  line-height:1 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  cursor:pointer !important;
  transition:all .25s ease !important;
  backdrop-filter:blur(8px);
}

/* hover suau */

body.page-id-329 .audiovisual-control:hover{
  background:rgba(243,176,63,0.35) !important;
  border-color:rgba(243,176,63,0.55) !important;
  transform:translateY(-1px) scale(1.04) !important;
}
/* VIDEO HERO SCALE FIX */
body.page-id-329 .video-item video{
  width:100%;
  height:100%;
  object-fit:cover;
}

/* evita que el logo del vídeo es vegi gegant */
body.page-id-329 .video-item{
  display:flex;
  align-items:center;
  justify-content:center;
}

body.page-id-329 .video-item video{
  max-width:1100px;
  max-height:70vh;
}
/* VIDEO HERO SCALE FIX */
body.page-id-329 .video-item video{
  width:100%;
  height:100%;
  object-fit:cover;
}
body.page-id-329 .visual-logo{
  position:absolute !important;
  top:50px !important;
  left:50% !important;
  transform:translateX(-50%) !important;
  display:block !important;
  width:300px !important;
  max-width:300px !important;
  z-index:30 !important;
  margin:0 !important;
  padding:0 !important;
}

body.page-id-329 .visual-logo img{
  display:block !important;
  width:100% !important;
  max-width:300px !important;
  height:auto !important;
  margin:0 auto !important;
  padding:0 !important;
}

@media (max-width:768px){
  body.page-id-329 .visual-logo{
    top:32px !important;
    width:220px !important;
    max-width:220px !important;
  }

  body.page-id-329 .visual-logo img{
    max-width:220px !important;
  }
}
/* =========================
   MENÚ PREMIUM GLOBAL
   Base general del botó i overlay
   ========================= */

/* Botó MENU fix a la part superior dreta */
.mm-premium-menu{
  position: fixed;                 /* el botó queda fix mentre fas scroll */
  top: 118px;                      /* separació des de dalt */
  right: 42px;                     /* separació des de la dreta */
  z-index: 999999;                 /* queda per sobre de gairebé tot */
}

/* Pastilla MENU */
.mm-premium-trigger{
  appearance: none;                /* elimina estil natiu del navegador */
  -webkit-appearance: none;
  display: flex;                   /* centra el text MENU */
  align-items: center;
  justify-content: center;
  width: 126px;                    /* amplada del botó */
  height: 56px;                    /* alçada del botó */
  padding: 0 24px;                 /* aire intern horitzontal */
  border: 1.5px solid rgba(255,255,255,0.92); /* vora blanca */
  border-radius: 999px;            /* forma de pastilla */
  background: rgba(34,53,69,0.20); /* blau corporatiu transparent */
  backdrop-filter: blur(8px);      /* efecte vidre */
  -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 10px 28px rgba(0,0,0,0.10); /* ombra suau */
  cursor: pointer;                 /* cursor clicable */
  outline: none;                   /* sense contorn blau del navegador */
  transition: border-color .25s ease, background .25s ease, transform .25s ease, box-shadow .25s ease;
}

/* Text del botó MENU */
.mm-premium-trigger span{
  color: #ffffff;                  /* text blanc */
  font-family: "Arial Rounded MT"; /* tipografia corporativa */
  font-size: 16px;                 /* mida del text */
  line-height: 1;                  /* evita desajustos verticals */
  letter-spacing: .4px;            /* una mica més d’aire entre lletres */
  transition: color .25s ease;
}

/* Hover i estat obert del botó */
.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;           /* groc corporatiu */
  background: rgba(34,53,69,0.32); /* una mica més visible */
  box-shadow: 0 14px 30px rgba(0,0,0,0.16);
  transform: translateY(-1px);     /* lleu elevació */
}

.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;                  /* text groc en hover */
}

/* Treure highlight estrany en tocar */
.mm-premium-trigger,
.mm-premium-trigger *{
  -webkit-tap-highlight-color: transparent;
}

/* Fons blur general quan s’obre el menú */
.mm-premium-overlay{
  position: fixed;                 /* cobreix tota la pantalla */
  inset: 0;                        /* top/right/bottom/left = 0 */
  z-index: 999998;                 /* just sota el botó */
  background: rgba(20,30,40,0.24); /* fons fosc transparent */
  backdrop-filter: blur(10px);     /* blur general */
  -webkit-backdrop-filter: blur(10px);
  opacity: 0;                      /* ocult per defecte */
  visibility: hidden;
  pointer-events: none;            /* no clicable quan està tancat */
  transition: opacity .35s ease, visibility .35s ease;
}

/* Quan el menú està obert */
.mm-premium-overlay.is-open{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

/* Contenidor centrat del panell */
.mm-premium-inner{
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;                   /* centra el panell dins l’overlay */
  align-items: center;
  justify-content: center;
  padding: 24px;                   /* marge exterior respecte a la pantalla */
}

/* =========================
   Panell central premium
   ========================= */

.mm-premium-panel{
  position: relative;
  width: min(70vw, 400px);
  min-height: min(64vh, 650px);

  border-radius: 22px;

  border: 1px solid rgba(255,255,255,0.20);

  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),
    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;
}

/* Estructura interna del panell */
.mm-premium-panel-content{
  min-height: inherit;             /* respecta l’alçada del panell */
  display: grid;                   /* permet separar navegació i peu */
  grid-template-rows: 1fr auto;    /* bloc principal + peu */
  justify-content: start;          /* tot arrenca a l’esquerra */
  align-content: space-between;    /* separa la zona principal del peu */
  padding: 58px 52px 28px;         /* dalt / laterals / baix */
}

/* Botó de tancar */
.mm-premium-close{
  position: absolute;              /* queda dins del panell */
  top: 18px;                       /* separació de dalt */
  right: 18px;                     /* separació de la dreta */
  width: 38px;                     /* botó més petit */
  height: 38px;
  border: 1px solid rgba(255,255,255,0.14); /* contorn fi */
  border-radius: 999px;            /* cercle */
  background: rgba(255,255,255,0.04); /* molt transparent */
  color: #ffffff;
  font-size: 22px;                 /* mida de la creu */
  line-height: 1;
  cursor: pointer;
  outline: none;
  transition: background .25s ease, border-color .25s ease;
}

.mm-premium-close:hover{
  background: rgba(255,255,255,0.08); /* lleu resposta */
  border-color: rgba(255,255,255,0.22);
}

/* =========================
   Navegació principal
   ========================= */

.mm-premium-nav{
  width: 100%;                     /* amplada total disponible */
  max-width: 560px;               /* columna principal una mica més ampla */
  margin: 0;                      /* sense autocentrat */
  display: flex;                  /* estructura vertical */
  flex-direction: column;
  align-items: flex-start;        /* alineació esquerra */
  justify-content: flex-start;
  gap: 0;                         /* la separació la controla cada bloc */
  text-align: left;
}

/* Reinici d’estils del tema dins del menú */
.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;
  border: none !important;
}
.mm-menu-item:last-child{
  padding-bottom: 8px;                   /* evita que Contacte toqui visualment el peu */
}

/* Enllaços principals del menú */
.mm-premium-nav a,
.mm-premium-nav a:hover,
.mm-premium-nav a:focus,
.mm-premium-nav a:active,
.mm-premium-nav a:visited{
  all: unset;                      /* reinicia estils del tema */
  display: inline-block;
  color: #ffffff;
  font-family: "Arial Rounded MT";
  font-size: clamp(1.55rem, 1.95vw, 2.15rem); /* mida més premium */
  line-height: 1;
  letter-spacing: .015em;
  opacity: .94;
  cursor: pointer;
  text-align: left;
  transition: color .25s ease, opacity .25s ease;
}

/* Hover dels títols: només color, sense moviment */
.mm-premium-nav a:hover{
  color: #f3b03f;
  opacity: 1;
}

/* Evitar selecció acolorida rara */
.mm-premium-nav ::selection{
  background: transparent;
  color: inherit;
}

/* Cada bloc del menú */
.mm-menu-item{
  position: relative;             /* necessari per a la línia inferior */
  display: flex;                  /* apila títol + subtítol */
  flex-direction: column;
  align-items: flex-start;        /* tot a l’esquerra */
  gap: 8px;                       /* separació entre títol i subtítol */
  padding: 18px 0 20px;           /* més aire i més aspecte editorial */
  width: 100%;
}

/* Línia separadora subtil sota cada bloc excepte l’últim */
.mm-menu-item:not(:last-child)::after{
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;                    /* línia completa com al referent */
  height: 1px;
  background: rgba(243,176,63,0.18); /* groc molt tènue */
}

/* Descripció petita sota els títols */
.mm-menu-desc{
  max-width: 420px;               /* ample màxim del subtítol */
  margin-top: 2px;                /* petit respir respecte al títol */
  font-size: 12px;                /* mida discreta */
  line-height: 1.75;              /* dona aire entre les línies d’Audiovisual */
  letter-spacing: .03em;          /* més editorial */
  text-align: left;
  color: rgba(243,176,63,0.68);   /* groc molt suau */
  opacity: 1;
}

/* =========================
   Peu inferior del panell
   ========================= */

.mm-premium-meta{
  display: flex;                         /* posa les xarxes en fila */
  justify-content: flex-start;           /* alineades amb el menú */
  align-items: center;
  gap: 34px;                             /* més aire entre xarxes */
  padding-top: 22px;                     /* separació entre línia i xarxes */
  margin-top: 30px;                      /* abaixa clarament el peu */
  border-top: 1px solid rgba(243,176,63,0.14); /* mateixa línia subtil */
  width: 100%;
  max-width: 560px;                      /* mateix ample que la navegació */
}

.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;                            /* neteja estils del tema */
  display: inline-block;
  cursor: pointer;
  font-size: 12px;                       /* més discret */
  color: rgba(255,255,255,0.46);         /* més subtil */
  letter-spacing: .04em;                 /* més premium */
  transition: color .25s ease;
}

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

/* Bloquejar scroll quan el menú està obert */
body.mm-menu-open{
  overflow: hidden;
}

/* Amagar el trigger antic d’Astra fora de la 329 */
body:not(.page-id-329) [data-section="section-header-mobile-trigger"]{
  display: none !important;
}

/* Excloure completament la pàgina 329 */
body.page-id-329 .mm-premium-menu,
body.page-id-329 .mm-premium-overlay{
  display: none !important;
}

/* =========================
   Responsive
   ========================= */

@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: calc(100vh - 36px);
    border-radius: 18px;
  }

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

  .mm-premium-close{
    top: 16px;
    right: 16px;
  }

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

  .mm-premium-trigger span{
    font-size: 15px;
  }

  .mm-premium-nav{
    max-width: 100%;
    gap: 10px;
  }

  .mm-premium-nav a{
    font-size: 1.9rem;
  }

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

  .mm-menu-desc{
    font-size: 12px;
    max-width: 100%;
  }

  .mm-premium-meta{
    margin-top: 24px;
    gap: 18px;
    flex-wrap: wrap;
    max-width: 100%;
  }
}