.hero{--hero-proporcio:2;border:1px solid var(--color-linia);touch-action:pan-y;background:#fff;margin:32px 0;position:relative;container-type:inline-size}.hero__pista{display:grid}.hero__diapositiva{opacity:0;visibility:hidden;background:#fff;flex-direction:column;grid-area:1/1;transition:opacity .8s,visibility 0s linear .8s;display:flex;position:relative}.hero__diapositiva--activa{z-index:1;opacity:1;visibility:visible;transition:opacity .8s,visibility}.hero__marc-imatge{aspect-ratio:var(--hero-proporcio);background:var(--color-linia);flex:none;position:relative;overflow:hidden}.hero__marc-imatge--buit{background:linear-gradient(135deg,#e9e5dc,#d6d1c5)}.hero__imatge{object-fit:cover;transition:transform 1.2s;transform:scale(1.03)}.hero__diapositiva--activa .hero__imatge{transform:scale(1)}.hero__text{flex-direction:column;flex:1;gap:10px;padding:24px 32px 20px;display:flex}.hero__categoria{letter-spacing:.04em;text-transform:uppercase;color:var(--color-accent);margin:0;font-size:13px;font-weight:700}.hero__tipus{color:#fff;background:var(--color-accent);margin-right:8px;padding:1px 6px}.hero__titol{font-family:var(--font-titols);text-wrap:balance;margin:0;font-size:38px;line-height:1.12}.hero__enllac{color:var(--color-text)}.hero__enllac:hover{text-underline-offset:4px;text-decoration:underline;text-decoration-thickness:2px}.hero__enllac:after{content:"";z-index:1;position:absolute;inset:0}.hero__enllac:focus-visible{outline:none}.hero__enllac:focus-visible:after{outline:3px solid var(--color-accent);outline-offset:-3px}.hero__entradeta{color:#333;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;max-width:900px;margin:0;font-size:19px;line-height:1.45;display:-webkit-box;overflow:hidden}.hero__data{color:var(--color-suau);font-size:13px}.hero__fletxa{top:calc(100cqw / (var(--hero-proporcio)) / 2);z-index:2;width:48px;height:48px;color:var(--color-text);cursor:pointer;border:1px solid var(--color-linia);-webkit-tap-highlight-color:transparent;background:#ffffffeb;border-radius:50%;justify-content:center;align-items:center;padding:0;transition:color .2s,background .2s;display:inline-flex;position:absolute;transform:translateY(-50%);box-shadow:0 2px 10px #00000026}.hero__fletxa--anterior{left:16px}.hero__fletxa--seguent{right:16px}.hero__controls{align-items:center;gap:12px;padding:0 32px 20px;display:flex}.hero__pausa{width:32px;height:32px;font:inherit;color:var(--color-text);cursor:pointer;border:1px solid var(--color-linia);-webkit-tap-highlight-color:transparent;background:#fff;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:11px;transition:color .2s,background .2s;display:inline-flex}@media (hover:hover){.hero__fletxa:hover,.hero__pausa:hover{color:#fff;background:var(--color-text);border-color:var(--color-text)}}.hero__punts{align-items:center;gap:4px;display:flex}.hero__punt{cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;justify-content:center;align-items:center;width:24px;height:24px;padding:0;display:inline-flex;position:relative}.hero__punt:before{content:"";background:var(--color-linia);border-radius:999px;width:10px;height:10px;transition:width .3s,background .3s}.hero__punt[aria-current=true]{width:44px}.hero__punt[aria-current=true]:before{width:36px}.hero__progres{background:var(--color-accent);transform-origin:0;border-radius:999px;width:36px;height:10px;animation:linear forwards hero-progres;position:absolute;top:7px;left:4px}@keyframes hero-progres{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.hero__punt[aria-current=true]:not(:has(.hero__progres)):before{background:var(--color-accent)}.hero__fletxa:focus-visible,.hero__pausa:focus-visible,.hero__punt:focus-visible{outline:3px solid var(--color-accent);outline-offset:2px}@media (max-width:900px){.hero{--hero-proporcio:16 / 9}.hero__titol{font-size:30px}.hero__entradeta{font-size:17px}}@media (max-width:600px){.hero{--hero-proporcio:3 / 2;margin:16px calc(-1 * var(--marge)) 24px;border-left:0;border-right:0}.hero__text{padding:16px var(--marge) 14px;gap:8px}.hero__titol{font-size:25px}.hero__entradeta{font-size:16px}.hero__fletxa{width:40px;height:40px}.hero__fletxa--anterior{left:10px}.hero__fletxa--seguent{right:10px}.hero__controls{padding:0 var(--marge) 16px}}@media (prefers-reduced-motion:reduce){.hero__diapositiva,.hero__diapositiva--activa,.hero__imatge,.hero__punt:before{transition:none}.hero__imatge{transform:none}}
