/* Nova Ràdio Lloret — estils del tema.
   Colors i lletra: theme.json (variables --wp--preset--*). Aquí només maquetació i components. */

:root {
	--ink: var(--wp--preset--color--ink, #0e1120);
	--sub: var(--wp--preset--color--sub, #5d6276);
	--rule: var(--wp--preset--color--rule, #e7e8ee);
	--soft: var(--wp--preset--color--soft, #f4f5f8);
	--paper: var(--wp--preset--color--paper, #fff);
	--navy: var(--wp--preset--color--navy, #152047);
	--navy-2: #22306b;
	--yel: var(--wp--preset--color--yellow, #f9e000);
	--yel-soft: var(--wp--preset--color--yellow-soft, #fff7b3);
	--grey-band: #eef0f3;
}

*, *::before, *::after { box-sizing: border-box; }
/* Tot el que porta «hidden» s'amaga de debò (si no, una finestra tancada però invisible bloqueja els clics) */
[hidden] { display: none !important; }
body { margin: 0; -webkit-font-smoothing: antialiased; padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)); }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; color: inherit; }
button { background: none; border: 0; cursor: pointer; padding: 0; }
img { max-width: 100%; height: auto; display: block; }
:focus-visible { outline: 3px solid var(--yel); outline-offset: 2px; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
svg.i { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; flex: none; }

.in { max-width: 1308px; margin: 0 auto; padding-inline: 24px; }
.in .in { max-width: none; padding-inline: 0; }
.h { font-weight: 800; letter-spacing: -.025em; line-height: 1.1; text-wrap: balance; margin: 0; }
.h a { background-image: linear-gradient(var(--yel), var(--yel)); background-size: 0 .32em; background-position: 0 88%; background-repeat: no-repeat; transition: background-size .25s ease; }
.h a:hover { background-size: 100% .32em; }
.k { display: block; font-weight: 800; font-size: 10px; letter-spacing: .09em; text-transform: uppercase; color: var(--navy); }
.home .k { font-weight: 200; } /* a la portada, l'etiqueta de secció més lleugera */
.by { font-size: 13px; color: var(--sub); font-weight: 500; }
.empty { color: var(--sub); font-size: 14px; margin: 0; }

/* Fotos: sempre amb cantonades rectes, retallades a la proporció del bloc */
.ph { display: block; position: relative; overflow: hidden; background: #d9dce4; }
.ph img { width: 100%; height: 100%; object-fit: cover; }
.ph-empty { display: block; width: 100%; height: 100%; min-height: 60px; background: var(--navy) url("../img/logo-nrll-white.png") center / 55% auto no-repeat; }

/* Àudio sobre la foto: fons blanc, a baix a la dreta */
.aud { position: absolute; right: 10px; bottom: 10px; z-index: 2; display: inline-flex; align-items: center; gap: 6px; background: #fff; color: #111; border-radius: 999px; padding: 5px 10px 5px 7px; font-weight: 700; font-size: 12.5px; line-height: 1; font-variant-numeric: tabular-nums; box-shadow: 0 2px 8px rgba(0, 0, 0, .18); }
.aud svg.i { width: 15px; height: 15px; stroke-width: 2.2; }
.bdg { position: absolute; right: 10px; bottom: 10px; z-index: 2; display: flex; gap: 6px; }
.bdg .aud { position: static; }
.aud.vdo svg.i { width: 12px; height: 12px; }
.bdg.lg { right: 16px; bottom: 16px; }
.bdg.lg .aud { font-size: 14px; padding: 7px 13px 7px 9px; }
.bdg.lg .aud svg.i { width: 17px; height: 17px; }
.bdg.lg .aud.vdo svg.i { width: 13px; height: 13px; }

/* ---------- «Avui a Lloret» (franja groga) ---------- */
.avui { background: var(--yel); color: #111; }
.avui .in { max-width: none; padding-inline: 32px; }
.avui-bar { display: flex; align-items: center; justify-content: center; gap: 14px; min-height: 42px; font-size: 13px; overflow: hidden; white-space: nowrap; }
.avui-bar .lbl { font-weight: 800; font-size: 11.5px; letter-spacing: .07em; text-transform: uppercase; }
.avui-bar .it { display: inline-flex; align-items: center; gap: 6px; color: #1d1d1d; }
.avui-bar .it b { font-weight: 700; color: #111; }
.avui-bar .it svg.i { width: 16px; height: 16px; }
.avui-bar > * { flex: none; }
/* Si no hi cap tot, l'agenda i l'avís s'escurcen amb «…» (mai es talla la franja) */
.avui-bar .it.x:has(.tx) { flex: 0 1 auto; min-width: 0; }
.avui-bar .tx { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 1150px) { .avui-bar .av { display: none; } }
@media (max-width: 980px) { .avui-bar .ag { display: none; } }
.avui-bar .sep { width: 1px; height: 14px; background: rgba(0, 0, 0, .22); flex: none; }
.avui-bar .tg { margin-left: 6px; display: inline-flex; align-items: center; gap: 5px; font-weight: 700; font-size: 13px; text-decoration: underline; text-underline-offset: 3px; }
.avui-bar .tg svg.i { width: 16px; height: 16px; transition: transform .2s; }
.avui.open .avui-bar .tg svg.i { transform: rotate(180deg); }
.avui-bar .tg .t-close, .avui.open .avui-bar .tg .t-open { display: none; }
.avui.open .avui-bar .tg .t-close { display: inline; }
/* «Tanca» a dalt a la dreta quan la franja està desplegada (com al menú de Seccions) */
.avui-bar { position: relative; }
.avui-x { display: none; position: absolute; right: 32px; top: 50%; transform: translateY(-50%); align-items: center; gap: 6px; font-weight: 700; font-size: 13px; padding: 6px 12px; border-radius: 999px; border: 1.5px solid #111; }
.avui-x svg.i { width: 14px; height: 14px; }
.avui-x:hover { background: rgba(255, 255, 255, .5); }
.avui.open .avui-x { display: inline-flex; }
.avui-panel { border-top: 1px solid rgba(0, 0, 0, .14); }
.avui-panel .avui-grid { padding: 18px 0 22px; max-width: 1260px; margin: 0 auto; }
.avui-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.3fr) minmax(0, 1.1fr) minmax(0, .9fr); gap: 28px; }
.avui-grid h4 { margin: 0 0 8px; font-weight: 800; font-size: 12px; letter-spacing: .09em; text-transform: uppercase; }
.wx { display: flex; align-items: center; gap: 12px; }
.wx svg.i { width: 44px; height: 44px; stroke-width: 1.5; }
.wx b { font-weight: 800; font-size: 44px; letter-spacing: -.04em; line-height: 1; }
.wx span { font-size: 14px; line-height: 1.3; }
.alist { list-style: none; margin: 0; padding: 0; }
.alist li { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 10px; padding: 8px 0; border-top: 1px solid rgba(0, 0, 0, .13); font-size: 14.5px; line-height: 1.3; }
.alist li time { font-weight: 800; font-size: 12.5px; padding-top: 1px; }
.alist.av li { grid-template-columns: 20px minmax(0, 1fr); }
.alist.av li::before { content: "!"; width: 20px; height: 20px; border-radius: 50%; background: #111; color: var(--yel); display: grid; place-items: center; font-weight: 800; font-size: 12px; }
.qlinks { display: grid; gap: 8px; align-content: start; }
.qlinks a { display: flex; justify-content: space-between; align-items: center; gap: 8px; background: rgba(255, 255, 255, .62); padding: 10px 12px; font-weight: 700; font-size: 14px; }
.qlinks a small { display: block; font-weight: 500; font-size: 12px; color: #4a4a2a; }
.qlinks a:hover { background: #fff; }
.qbox { background: rgba(255, 255, 255, .62); padding: 12px 14px; display: grid; gap: 3px; font-size: 14px; line-height: 1.35; }
.qbox h4 { margin: 0 0 4px; }
.qbox b { font-weight: 800; font-size: 15px; }
.qbox small { font-size: 12px; color: #4a4a2a; }
.qlinks .qbox a { display: inline-flex; justify-content: flex-start; background: none; padding: 0; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.qlinks .qbox a.tel { gap: 6px; font-size: 15px; margin-top: 2px; }
.qbox a.tel svg.i { width: 16px; height: 16px; }
.obits { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.obits b { font-size: 14px; }
.obits small { display: block; }
.alist a { text-decoration: underline; text-decoration-color: rgba(0, 0, 0, .25); text-underline-offset: 3px; }
.alist a:hover { text-decoration-color: currentColor; }
a.it { text-decoration: none; }
a.it:hover b { text-decoration: underline; }
.ai { display: inline-block; font-size: 10.5px; font-weight: 800; letter-spacing: .04em; background: #111; color: var(--yel); border-radius: 5px; padding: 2px 5px; margin-left: 6px; vertical-align: 1px; }
.avui-card { background: var(--yel); padding: 20px; }
.avui-card .ttl { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 12px; }
.avui-card .ttl .h { font-size: 22px; }
.avui-card .ttl span { font-weight: 700; font-size: 12.5px; }
.avui-card .avui-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
.avui-card.wide-avui { margin: 0 0 40px; }
.avui-card.wide-avui .avui-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.avui-card.wide-avui .qlinks { grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* ---------- Capçalera (a tot l'ample, logo al centre, groga en fer scroll) ---------- */
.hdr { position: sticky; top: 0; z-index: 40; background: #fff; transition: background-color .35s ease, box-shadow .35s ease; }
.admin-bar .hdr { top: 32px; }
.hdr.sc { background: var(--yel); box-shadow: 0 10px 24px -18px rgba(14, 17, 32, .5); }
.hdr-top { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 16px; min-height: 78px; max-width: none; padding-inline: 32px; transition: min-height .3s ease; }
.hdr.sc .hdr-top { min-height: 50px; }
.hdr-l { display: flex; align-items: center; gap: 10px; min-width: 0; }
.hdr-r { display: flex; justify-content: flex-end; align-items: center; gap: 6px; min-width: 0; }
.hdr-r .soc { display: flex; }
.logo { display: flex; align-items: center; justify-self: center; }
.logo .wm { height: 31px; width: auto; transition: height .3s ease; }
.hdr.sc .logo .wm { height: 19px; }
.sec-btn { display: inline-flex; align-items: center; gap: 9px; border: 1.5px solid var(--ink); border-radius: 999px; padding: 9px 15px 9px 12px; font-weight: 700; font-size: 14px; }
.sec-btn:hover { background: rgba(0, 0, 0, .05); }
.ib { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; }
.ib:hover { background: rgba(0, 0, 0, .06); }
.ib svg.i { width: 19px; height: 19px; }
.live-btn { display: inline-flex; align-items: center; gap: 9px; background: var(--navy); color: #fff; border-radius: 999px; padding: 7px 15px 7px 7px; font-weight: 700; font-size: 14px; margin-left: 6px; white-space: nowrap; }
.hdr.sc .live-btn { background: #111; }
.live-btn .pb { width: 28px; height: 28px; border-radius: 50%; background: var(--yel); color: #111; display: grid; place-items: center; }
.live-btn .pb svg.i { width: 11px; height: 11px; }
.live-btn i { width: 7px; height: 7px; border-radius: 50%; background: #ff5247; animation: nrll-pulse 1.8s infinite; }
.live-btn .pz, .live-btn.on .pl { display: none; }
.live-btn.on .pz { display: block; }
@keyframes nrll-pulse { 0% { box-shadow: 0 0 0 0 rgba(255, 82, 71, .6); } 70% { box-shadow: 0 0 0 7px rgba(255, 82, 71, 0); } 100% { box-shadow: 0 0 0 0 rgba(255, 82, 71, 0); } }

/* ---------- Menú de Seccions (entrada suau) ---------- */
.mega { position: fixed; inset: 0; z-index: 60; background: #fff; overflow-y: auto; padding-top: env(safe-area-inset-top, 0px); opacity: 0; transform: translateY(-14px); transition: opacity .28s ease, transform .38s cubic-bezier(.2, .8, .2, 1); }
.mega.open { opacity: 1; transform: none; }
.mega-top { display: flex; align-items: center; gap: 18px; min-height: 78px; border-bottom: 1px solid var(--rule); }
.mega-top .logo { justify-self: start; }
.mega-top .close { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; font-weight: 700; padding: 9px 14px; border-radius: 999px; border: 1.5px solid var(--ink); }
.mega-search { display: flex; align-items: center; gap: 12px; border-bottom: 2px solid var(--ink); padding: 18px 0 12px; margin-top: 26px; }
.mega-search svg.i { width: 26px; height: 26px; }
.mega-search input { flex: 1; border: 0; outline: 0; font-size: 24px; font-weight: 600; background: transparent; min-width: 0; }
.mega-cols { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, .9fr); gap: 36px; padding-block: 30px 40px; }
.mega h3 { margin: 0 0 14px; font-weight: 800; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--sub); }
.mega ul { list-style: none; margin: 0; padding: 0; display: grid; }
.mega .bigl { gap: 4px; }
.mega .bigl a { font-weight: 800; font-size: 25px; letter-spacing: -.03em; line-height: 1.25; }
.mega .bigl a:hover { background: linear-gradient(transparent 62%, var(--yel) 62%); }
.mega .sml { gap: 9px; }
.mega .sml a { font-weight: 600; font-size: 16px; }
.mega .sml a:hover { text-decoration: underline; text-decoration-color: var(--yel); text-decoration-thickness: 3px; text-underline-offset: 3px; }
.mega-foot { padding-block: 20px 40px; border-top: 1px solid var(--rule); }
.mega .mega-search, .mega .mega-cols > div, .mega .mega-foot { opacity: 0; transform: translateY(12px); transition: opacity .35s ease, transform .45s cubic-bezier(.2, .8, .2, 1); }
.mega.open .mega-search { opacity: 1; transform: none; transition-delay: .06s; }
.mega.open .mega-cols > div { opacity: 1; transform: none; }
.mega.open .mega-cols > div:nth-child(1) { transition-delay: .1s; }
.mega.open .mega-cols > div:nth-child(2) { transition-delay: .15s; }
.mega.open .mega-cols > div:nth-child(3) { transition-delay: .2s; }
.mega.open .mega-cols > div:nth-child(4) { transition-delay: .25s; }
.mega.open .mega-foot { opacity: 1; transform: none; transition-delay: .3s; }
html.nrll-lock, html.nrll-lock body { overflow: hidden; }

/* ---------- Portada ---------- */
.hero { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 24px; padding-block: 24px 6px; align-items: stretch; }
.hero-big { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: #111; }
.hero-big > .ph { position: absolute; inset: 0; }
.hero-big .ov { position: absolute; inset: auto 0 0 0; z-index: 1; padding: 120px 28px 26px; background: linear-gradient(transparent, rgba(5, 8, 20, .86)); color: #fff; display: grid; gap: 10px; }
.hero-big .k { color: var(--yel); }
.hero-big .h { font-size: 42px; line-height: 1.05; letter-spacing: -.035em; max-width: 22ch; }
.hero-big .by { color: #d5d9e8; }
/* Regla fixa: la columna dreta no aporta alçada; mai acaba més avall que la principal */
.hero-side { display: flex; flex-direction: column; height: 0; min-height: 100%; overflow: hidden; }
.hs { flex: none; display: grid; gap: 7px; padding: 14px 0; border-top: 1px solid var(--rule); min-width: 0; }
.hs:first-child { border-top: 0; padding-top: 0; }
.hs:last-child { padding-bottom: 0; }
.hs.img { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; gap: 7px; }
.hs.img .ph { flex: 1 1 auto; min-height: 80px; margin-bottom: 4px; }
.hs.img > :not(.ph) { flex-shrink: 0; }
.hs .h { font-size: 19px; line-height: 1.2; letter-spacing: -.02em; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

.blk { padding-block: 30px 4px; }
.sec-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 16px; padding-top: 12px; border-top: 1px solid var(--ink); }
.sec-h .h { font-size: 24px; letter-spacing: -.03em; }
.sec-h a { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 13.5px; }
.sec-h a svg.i { width: 15px; height: 15px; }
.sec-h a:hover { text-decoration: underline; }

.card { display: grid; align-content: start; gap: 8px; min-width: 0; }
.card .ph { aspect-ratio: 3 / 2; margin-bottom: 4px; }
.card .h { font-size: 18.5px; line-height: 1.22; letter-spacing: -.015em; }
.duo, .quad, .g3, .g4 { display: grid; gap: 22px; }
.duo { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.duo .ph { aspect-ratio: 16 / 9; }
.duo .h { font-size: 30px; line-height: 1.08; letter-spacing: -.03em; }
.quad, .g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.posts-duo, .posts-quad { padding-top: 26px; }
.rows { display: grid; }
.rows .card { grid-template-columns: minmax(0, 1fr) 150px; column-gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--rule); }
.rows .card .ph { grid-column: 2; grid-row: 1 / span 3; margin: 0; }

.two { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 44px; align-items: start; }
.two-main > .blk:first-child { padding-top: 0; }
.rail { display: grid; gap: 28px; align-content: start; }


.ad { display: grid; place-items: center; min-height: 250px; }
.ad-wide { min-height: 110px; margin-block: 30px; }
.ad-demo { gap: 4px; border: 1px dashed #c8cbd5; color: #8a8e9c; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; background: repeating-linear-gradient(135deg, transparent 0 12px, rgba(0, 0, 0, .025) 12px 24px); align-content: center; }
.ad-demo small { letter-spacing: 0; text-transform: none; font-size: 12px; }

.pop { border-top: 1px solid var(--ink); padding-top: 12px; }
.pop h3 { margin: 0 0 4px; font-weight: 800; font-size: 20px; letter-spacing: -.025em; }
.pop ol { list-style: none; margin: 0; padding: 0; }
.pop li { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 8px; padding: 12px 0; border-bottom: 1px solid var(--rule); align-items: start; }
.pop li b { font-weight: 800; font-size: 30px; line-height: 1; letter-spacing: -.04em; color: var(--navy); }
.pop li a { font-weight: 700; font-size: 15px; line-height: 1.3; }
.pop li a:hover { text-decoration: underline; text-decoration-color: var(--yel); text-decoration-thickness: 3px; }

/* «A la carta» (estructura de l'actual, fons gris) */
.mdc { background: var(--grey-band); padding-block: 26px 30px; margin-block: 40px 10px; }
.mdc-top { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.mdc-title { background: #fff; color: #111; font-weight: 600; font-size: 18px; line-height: 1; padding: 10px 14px; }
.mdc-top .all { margin-left: auto; text-decoration: underline; font-size: 14px; }
.mdc-nav, .car-nav { display: flex; gap: 6px; }
.mdc-nav button { width: 40px; height: 40px; background: #fff; color: #111; display: grid; place-items: center; box-shadow: 0 1px 2px rgba(0, 0, 0, .08); }
.mdc-nav button:disabled { background: #e1e4ea; color: #a3a8b5; cursor: default; }
.mdc-track, .car-track { display: grid; grid-auto-flow: column; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; scroll-behavior: smooth; }
.mdc-track::-webkit-scrollbar, .car-track::-webkit-scrollbar { display: none; }
.mdc-track { grid-auto-columns: calc((100% - 3 * 20px) / 3.6); gap: 20px; }
.mdc-item { scroll-snap-align: start; display: grid; gap: 10px; align-content: start; }
.mdc-item .ph { aspect-ratio: 16 / 9; background-color: #cfd3db; }
.mdc-item .mt { font-size: 19px; line-height: 1.25; }
.mdc-item:hover .mt { text-decoration: underline; }
.car-track { grid-auto-columns: calc((100% - 3 * 22px) / 4); gap: 22px; }
.car-track .card { scroll-snap-align: start; }
.car-nav button { width: 38px; height: 38px; border: 1.5px solid var(--ink); display: grid; place-items: center; background: #fff; }
.car-nav button:disabled { border-color: var(--rule); color: #b5b8c4; cursor: default; }

/* Canals */
.chan-wrap { padding-block: 40px; }
.chan { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px 36px; align-items: center; background: var(--navy); color: #fff; padding: 28px 32px; }
.chan .h { font-size: 28px; letter-spacing: -.035em; }
.chan p { margin: 6px 0 0; color: #c4cbec; font-size: 15.5px; }
.chan.inpost { margin-block: 0 26px; padding: 24px; grid-template-columns: minmax(0, 1fr); }
.chan.inpost .h { font-size: 23px; }
.cbs { display: flex; flex-wrap: wrap; gap: 10px; }
.cb { display: inline-flex; align-items: center; gap: 10px; padding: 13px 18px; border-radius: 999px; font-weight: 800; font-size: 15px; color: #fff; }
.cb svg.i { width: 21px; height: 21px; }
.cb.wa { background: #0f7a3f; }
.cb.tg { background: #1c6fa8; }
.cb.ig { background: #fff; color: #111; }
.mega-foot .cb.ig { background: var(--ink); color: #fff; }
.cb:hover { filter: brightness(1.08); }

/* ---------- Centrada 2: reproductor a sobre de la foto ---------- */
.ce-fig-audio .ph { position: relative; }
.apo { position: absolute; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 12px 16px; background: rgba(14, 17, 32, .74); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff; }
.apo svg.i { stroke-width: 1.7; }
.apo .play { width: 48px; height: 48px; border-radius: 50%; background: var(--yel); color: #111; display: grid; place-items: center; flex: none; }
.apo .play svg.i { width: 17px; height: 17px; stroke-width: 2; }
.apo .pz, .apo.on .pl { display: none; }
.apo.on .pz { display: block; }
.apo-mid { display: grid; gap: 6px; min-width: 0; }
.apo-t { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.apo .t2 { font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--yel); flex: none; }
.apo .t1 { font-weight: 700; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.apo .bar { height: 4px; border-radius: 4px; background: rgba(255, 255, 255, .3); position: relative; overflow: hidden; cursor: pointer; }
.apo .bar i { position: absolute; inset: 0 auto 0 0; width: 0; background: var(--yel); border-radius: 4px; }
.apo .tm { display: flex; justify-content: space-between; font-size: 12px; color: #d6dbf3; font-variant-numeric: tabular-nums; }
.apo-r { display: flex; align-items: center; gap: 2px; }
.apo .ap-skip, .apo .ic { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; color: #fff; position: relative; opacity: .9; }
.apo .ap-skip:hover, .apo .ic:hover { background: rgba(255, 255, 255, .14); opacity: 1; }
.apo .ap-skip svg.i { width: 22px; height: 22px; }
.apo .ap-skip span { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -40%); font-size: 7.5px; font-weight: 700; }
.apo .ic svg.i { width: 16px; height: 16px; }
.apo .spd { min-width: 36px; height: 24px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .5); font-weight: 700; font-size: 12px; padding: 0 8px; color: #fff; margin: 0 4px; }
.apo .spd.on { background: var(--yel); color: #111; border-color: var(--yel); }
@media (max-width: 720px) {
	.apo { gap: 10px; padding: 10px 12px; grid-template-columns: auto minmax(0, 1fr); }
	.apo-r { display: none; }
	.apo .play { width: 42px; height: 42px; }
	.apo .t1 { font-size: 14px; }
}

/* ---------- Entrevistes senceres (targetes fosques, com les del pòdcast del 3Cat) ---------- */
.ent-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.ent { display: grid; align-content: start; gap: 10px; background: #0f1016; color: #fff; border-radius: 18px; padding: 14px 14px 16px; min-width: 0; }
.ent .ph { aspect-ratio: 16 / 10; display: block; overflow: hidden; }
.ent .ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ent-k { color: var(--yel); font-weight: 800; font-size: 15px; margin-top: 4px; }
.ent .h { font-size: 19px; line-height: 1.25; letter-spacing: -.015em; color: #fff; }
.ent .h a { color: inherit; }
.ent .h a:hover { text-decoration: underline; }
.ent-meta { display: flex; justify-content: space-between; align-items: center; margin-top: 4px; }
.ent-meta .du { display: inline-flex; align-items: center; gap: 7px; font-size: 15px; }
.ent-meta .du svg.i { width: 18px; height: 18px; }
.ent .shr-btn.ic { width: 40px; height: 40px; border-color: rgba(255, 255, 255, .5); color: #fff; }
.ent .shr-btn.ic:hover { background: rgba(255, 255, 255, .12); }
.ent .shr-menu { color: var(--ink); }
.ent-btn { display: flex; justify-content: center; align-items: center; gap: 12px; background: var(--yel); color: #111; border-radius: 999px; padding: 14px 18px; font-weight: 800; font-size: 16px; margin-top: 6px; transition: transform .15s; }
.ent-btn:hover { transform: scale(1.02); }
.ent-btn svg.i { width: 22px; height: 22px; stroke-width: 2; }
.ent-btn .t2, .ent-btn .pz, .ent-btn.on .t1, .ent-btn.on .hp { display: none; }
.ent-btn.on .t2, .ent-btn.on .pz { display: block; }
/* Targetes especials dins les graelles de notícies («promos» del bloc nrll/posts): la d'escoltar (negra) i l'agenda (blau marí) */
.pc-ov { font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .7); margin-top: 2px; }
.pc-ov + .ent-k { margin-top: -4px; }
.quad .ent, .g3 .ent, .g4 .ent { padding: 12px 12px 14px; gap: 8px; }
.quad .ent .h, .g3 .ent .h, .g4 .ent .h { font-size: 17px; }
.quad .ent-k, .g3 .ent-k, .g4 .ent-k { font-size: 14px; }
.quad .ent-meta .du, .g3 .ent-meta .du, .g4 .ent-meta .du { font-size: 14px; }
.quad .ent .shr-btn.ic, .g3 .ent .shr-btn.ic, .g4 .ent .shr-btn.ic { width: 36px; height: 36px; }
.quad .ent-btn, .g3 .ent-btn, .g4 .ent-btn { padding: 11px 14px; font-size: 14.5px; gap: 10px; }
.quad .ent-btn svg.i, .g3 .ent-btn svg.i, .g4 .ent-btn svg.i { width: 19px; height: 19px; }
.pc-ag { background: var(--navy); grid-template-rows: auto auto 1fr auto; align-content: stretch; }
.pc-ag .h { font-size: 19px; }
.pc-list { list-style: none; margin: 2px 0 0; padding: 0; align-self: start; }
.pc-list li { display: grid; grid-template-columns: 50px minmax(0, 1fr); gap: 10px; padding: 8px 0; border-top: 1px solid rgba(255, 255, 255, .14); font-size: 14px; line-height: 1.3; }
.pc-list li:first-child { border-top: 0; padding-top: 2px; }
.pc-list b { color: var(--yel); font-size: 12px; text-transform: uppercase; letter-spacing: .04em; padding-top: 2px; }
.pc-list span { display: grid; gap: 2px; min-width: 0; }
.pc-list a { color: #fff; font-weight: 600; }
.pc-list a:hover { text-decoration: underline; }
.pc-list small { font-size: 12px; color: rgba(255, 255, 255, .65); }
.pc-ag .ent-btn { align-self: end; }
.pc-radio { background: var(--navy); }
.pc-radio .h { font-size: 19px; }
.pc-radio .pc-list li.past, .pc-radio .pc-list li.far { display: none; }
.pc-radio .pc-list li.now b { color: #fff; background: var(--yel); color: #111; border-radius: 999px; padding: 2px 8px; justify-self: start; font-size: 11px; }
.pc-radio .pc-list small { display: none; }
.pc-radio .pc-list li.now small { display: block; }
.pc-more { display: inline-flex; align-items: center; gap: 6px; justify-self: center; color: rgba(255, 255, 255, .8); font-size: 13.5px; font-weight: 700; margin-top: 2px; }
.pc-more:hover { color: #fff; }
.pc-more svg.i { width: 14px; height: 14px; }
.promo-blk { margin-bottom: 26px; }
.ph video.vposter { width: 100%; height: 100%; object-fit: cover; display: block; background: var(--soft); pointer-events: none; }
@media (max-width: 1080px) { .ent-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .ent-grid { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Peu ---------- */
.site-footer { margin-top: 30px; }
.ftr { background: var(--soft); padding-block: 40px 30px; font-size: 14px; }
.ftr .cols { display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)); gap: 28px; }
.ftr .logo { justify-self: start; }
.ftr .logo .wm { height: 26px; }
.ftr h3 { font-weight: 800; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--sub); margin: 4px 0 12px; }
.ftr ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.ftr a:hover { text-decoration: underline; }
.ftr .contact { display: grid; gap: 3px; margin-top: 14px; color: var(--sub); }
.app, .find { margin-top: 16px; display: grid; gap: 8px; }
.app > span, .find > span { font-weight: 700; font-size: 13px; }
.app-b { display: flex; flex-wrap: wrap; gap: 8px; }
.store { display: inline-flex; align-items: center; gap: 9px; background: #111; color: #fff; border-radius: 10px; padding: 7px 13px 7px 10px; font-weight: 700; font-size: 14px; line-height: 1.1; }
.store small { display: block; font-weight: 500; font-size: 10.5px; opacity: .8; }
.store svg.i { width: 22px; height: 22px; }
.store:hover { background: var(--navy); text-decoration: none !important; }
.find .soc { display: flex; flex-wrap: wrap; gap: 2px; margin-left: -8px; }
.ftr .legal { margin-top: 28px; padding-top: 16px; border-top: 1px solid var(--rule); display: flex; flex-wrap: wrap; gap: 8px 20px; color: var(--sub); font-size: 13px; }

/* ---------- Reproductor fix (estil Radio France: barra fosca translúcida, progrés a dalt, controls al mig, eines a la dreta) ---------- */
.sp { position: fixed; left: 50%; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); width: min(1260px, calc(100% - 24px)); z-index: 50; background: rgba(31, 31, 63, .86); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); color: #fff; border-radius: 12px; box-shadow: 0 18px 40px -16px rgba(5, 10, 40, .6); display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 16px; padding: 13px 14px 10px 12px; transition: transform .35s ease, opacity .35s ease; }
.sp.off { transform: translate(-50%, 160%); opacity: 0; pointer-events: none; }
.sp-bar { position: absolute; left: 12px; right: 12px; top: 0; height: 4px; border-radius: 4px; background: rgba(255, 255, 255, .16); cursor: pointer; }
.sp-bar i { display: block; height: 100%; width: 0; border-radius: 4px; background: var(--yel); }
.sp-bar:focus-visible { outline: 2px solid var(--yel); outline-offset: 3px; }
.sp.is-live .sp-bar, .sp.is-live .sp-time { display: none; }
.sp.is-live .sp-skip { opacity: .3; pointer-events: none; } /* en directe no es pot saltar, però els botons hi són perquè el reproductor es vegi sencer */
.sp-l { display: flex; align-items: center; gap: 12px; min-width: 0; }
.sp-cov { width: 52px; height: 52px; border-radius: 8px; background: var(--navy-2) url("../img/logo-nrll-white.png") center / 84% auto no-repeat; flex: none; }
.sp-cov.img { background-size: cover; }
.sp-txt { min-width: 0; }
.sp-tag { display: inline-flex; align-items: center; gap: 6px; font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--yel); }
.sp-tag i { width: 7px; height: 7px; border-radius: 50%; background: #ff5247; }
.sp.track .sp-tag i { display: none; }
.sp-t { font-weight: 700; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp-s { font-size: 12.5px; color: #c3c8e6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp-c { display: grid; justify-items: center; gap: 1px; }
.sp-ctl { display: flex; align-items: center; gap: 4px; }
.sp-ib { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; color: #fff; opacity: .85; position: relative; }
.sp-ib:hover { background: rgba(255, 255, 255, .12); opacity: 1; }
.sp-ib svg.i { width: 20px; height: 20px; }
.sp-skip svg.i { width: 25px; height: 25px; }
.sp-skip span { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -40%); font-size: 8px; font-weight: 800; letter-spacing: -.02em; }
.sp-play { width: 46px; height: 46px; border-radius: 50%; background: #fff; color: #1f1f3f; display: grid; place-items: center; margin: 0 6px; transition: transform .15s; }
.sp-play:hover { transform: scale(1.06); }
.sp-play svg.i { width: 18px; height: 18px; }
.sp-play .pz, .sp.on .sp-play .pz ~ .pl, .sp.on .sp-play .pl { display: none; }
.sp.on .sp-play .pz { display: block; }
.sp-time { display: flex; gap: 5px; font-size: 12px; color: #c3c8e6; font-variant-numeric: tabular-nums; }
.sp-r { display: flex; justify-content: flex-end; align-items: center; gap: 6px; }
.sp-pill { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 6px 11px; font-weight: 700; font-size: 12.5px; color: #fff; border: 1.5px solid rgba(255, 255, 255, .32); }
.sp-pill:hover { border-color: #fff; background: rgba(255, 255, 255, .08); }
.sp-pill svg.i { width: 15px; height: 15px; }
.sp-pill.on { background: var(--yel); color: #111; border-color: var(--yel); }
.sp-tools { display: flex; align-items: center; gap: 2px; margin-left: 6px; padding-left: 8px; border-left: 1px solid rgba(255, 255, 255, .14); }
.sp-speed, .sp-vol { position: relative; display: flex; align-items: center; }
.sp-rate { width: auto; min-width: 36px; padding: 0 7px; border-radius: 8px; font-weight: 800; font-size: 13px; }
.sp-menu { position: absolute; right: 0; bottom: calc(100% + 14px); min-width: 200px; background: rgba(31, 31, 63, .97); border-radius: 12px; padding: 8px 6px; box-shadow: 0 18px 40px -12px rgba(0, 0, 0, .6); display: grid; z-index: 2; }
.sp-menu[hidden] { display: none; }
.sp-menu b { font-size: 15px; padding: 8px 12px 10px; }
.sp-menu button { text-align: left; padding: 9px 12px; border-radius: 8px; color: #fff; font-size: 14px; display: flex; justify-content: space-between; gap: 12px; }
.sp-menu button:hover { background: rgba(255, 255, 255, .1); }
.sp-menu button.on::after { content: "✓"; }
.sp-vol input { width: 0; opacity: 0; margin: 0; transition: width .2s, opacity .2s; }
.sp-vol:hover input, .sp-vol:focus-within input { width: 84px; opacity: 1; margin-right: 6px; }
.sp .mu, .sp.muted .vo { display: none; }
.sp.muted .mu { display: block; }
/* Minimitzat: píndola a baix a la dreta amb portada, «En directe» o «Ara escoltes», títol, ampliar i play */
.sp.min, html.nrll-lock .sp.min { left: auto; right: 12px; transform: none; width: min(520px, calc(100% - 24px)); max-width: none; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; padding: 10px 10px 10px 10px; border-radius: 16px; }
.sp.min .sp-bar, .sp.min .sp-time, .sp.min .sp-skip, .sp.min .sp-nav, .sp.min .sp-s, .sp.min .sp-pill, .sp.min .sp-speed, .sp.min .sp-vol { display: none; }
.sp.min .sp-cov { width: 50px; height: 50px; border-radius: 8px; }
.sp.min .sp-t { font-size: 15px; }
.sp.min .sp-c { order: 3; }
.sp.min .sp-r { order: 2; }
.sp.min .sp-play { width: 44px; height: 44px; margin: 0; background: var(--yel); }
.sp.min .sp-tools { margin: 0; padding: 0; border: 0; }
.sp .js-sp-min .ex, .sp.min .js-sp-min .dn { display: none; }
.sp.min .js-sp-min .ex { display: block; }

/* ---------- Notícia ---------- */
.crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-size: 13px; color: var(--sub); padding-top: 22px; }
.crumbs a:hover { color: var(--ink); }
.a-head { max-width: 920px; display: grid; gap: 16px; padding-block: 0 26px; }
.a-head .h, .to-head .h { font-size: 52px; line-height: 1.03; letter-spacing: -.04em; }
.dek { font-size: 20px; line-height: 1.5; color: #34384a; margin: 0; }
.dek mark { background: linear-gradient(transparent 55%, var(--yel) 55%); color: inherit; padding: 0 2px; } /* frase clau de l'extracte (prototip v4) */
.keys { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.keys li { display: grid; grid-template-columns: 14px minmax(0, 1fr); gap: 10px; font-weight: 600; font-size: 15.5px; }
.keys li::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--yel); margin-top: 7px; }
.keys a:hover { text-decoration: underline; }
.a-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; padding-top: 4px; }
.a-meta .by b { color: var(--ink); font-weight: 800; }
.share { display: flex; flex-wrap: wrap; gap: 6px; }
.share a, .share button { display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 12px; border-radius: 999px; background: var(--soft); font-weight: 700; font-size: 13px; }
.share a:hover, .share button:hover { background: var(--yel-soft); }
.share svg.i { width: 17px; height: 17px; }
.share.ico a, .share.ico button { width: 38px; padding: 0; justify-content: center; }
.share .copied { background: var(--yel); }
.a-fig .ph, .vx-fig .ph, .to-fig .ph { aspect-ratio: 16 / 8; }
figure { margin: 0; }
figcaption { font-size: 12px; color: var(--sub); margin-top: 9px; line-height: 1.4; }
.a-body { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 56px; padding-block: 30px 10px; }
.a-main { min-width: 0; max-width: 800px; }
.side { display: grid; gap: 26px; align-content: start; }
.side .avui-card { position: sticky; top: 90px; }

/* Reproductor de la notícia (sense requadre) */
.ap { display: grid; grid-template-areas: "who ctl tools" "who tm tools" "bar bar bar"; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 2px 12px; margin-bottom: 24px; padding: 0; color: var(--ink); }
.ap-who { grid-area: who; display: grid; gap: 1px; min-width: 0; align-self: center; }
.ap-ctl { grid-area: ctl; display: flex; align-items: center; gap: 4px; justify-self: center; }
.ap-tools { grid-area: tools; display: flex; align-items: center; justify-content: flex-end; gap: 6px; align-self: center; } /* descarrega · comparteix · velocitat · volum, en una fila (abans el volum anava en vertical i quedava estrany) */
.ap-ic-row { display: flex; gap: 2px; }
.ap .bar { grid-area: bar; margin-top: 6px; }
.ap .tm { grid-area: tm; justify-self: center; }
.ap svg.i { stroke-width: 1.5; }
.ap .t2 { font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--sub); }
.ap .t1 { font-weight: 800; font-size: 13.5px; line-height: 1.25; }
.ap-ic-row a, .ap-ic-row button { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; color: var(--ink); }
.ap-ic-row a:hover, .ap-ic-row button:hover { background: var(--soft); }
.ap-ic-row svg.i { width: 16px; height: 16px; }
.ap-vol { display: flex; align-items: center; gap: 2px; margin-left: 4px; }
.ap-vol button { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; color: var(--ink); }
.ap-vol button:hover { background: var(--soft); }
.ap-vol svg.i { width: 17px; height: 17px; }
.ap-vol input { width: 72px; height: 3px; margin: 0; }
/* Lliscadors de volum prims (notícia i reproductor fix) */
.js-ap-vol, .js-sp-vol { -webkit-appearance: none; appearance: none; height: 3px; border-radius: 3px; background: var(--rule); outline: none; cursor: pointer; }
.js-ap-vol::-webkit-slider-thumb, .js-sp-vol::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 12px; height: 12px; border-radius: 50%; background: var(--ink); border: 0; }
.js-ap-vol::-moz-range-thumb, .js-sp-vol::-moz-range-thumb { width: 12px; height: 12px; border-radius: 50%; background: var(--ink); border: 0; }
.js-ap-vol::-moz-range-track, .js-sp-vol::-moz-range-track { height: 3px; border-radius: 3px; background: var(--rule); }
.js-sp-vol { background: rgba(255, 255, 255, .3); }
.js-sp-vol::-webkit-slider-thumb { background: #fff; }
.js-sp-vol::-moz-range-thumb { background: #fff; }
.js-sp-vol::-moz-range-track { background: rgba(255, 255, 255, .3); }
.ap .mu, .ap.muted .vo { display: none; }
.ap.muted .mu { display: block; }
.ap-skip { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; color: var(--ink); position: relative; }
.ap-skip:hover { background: var(--soft); }
.ap-skip svg.i { width: 22px; height: 22px; }
.ap-skip span { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -40%); font-size: 7.5px; font-weight: 700; letter-spacing: -.02em; }
.ap .play { width: 36px; height: 36px; border-radius: 50%; background: var(--yel); color: #111; display: grid; place-items: center; transition: transform .15s; }
.ap .play:hover { transform: scale(1.06); }
.ap .play svg.i { width: 14px; height: 14px; stroke-width: 1.9; }
.ap .pz, .ap.on .pl { display: none; }
.ap.on .pz { display: block; }
.ap .spd { min-width: 38px; height: 24px; border-radius: 999px; border: 1px solid var(--ink); font-weight: 700; font-size: 12.5px; padding: 0 10px; color: var(--ink); }
.ap .spd:hover { background: var(--soft); }
.ap .spd.on { background: var(--ink); color: #fff; }
.ap .bar { height: 3px; background: var(--rule); border-radius: 3px; position: relative; overflow: hidden; cursor: pointer; }
.ap .bar i { position: absolute; inset: 0 auto 0 0; width: 0; background: var(--ink); border-radius: 4px; }
.ap .bar:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.ap .tm { display: flex; gap: 5px; font-size: 11.5px; color: var(--sub); font-variant-numeric: tabular-nums; white-space: nowrap; }
/* Àudios dels [smart_track_player] antics (sardanes, plens): fila compacta amb vora fina, un reproductor per àudio */
.ap.ap-sc { grid-template-areas: "play who tm dl" "play bar bar bar"; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 4px 12px; margin: 0 0 12px; padding: 10px 12px; border: 1px solid var(--rule); }
.ap-sc .play { grid-area: play; }
.ap-sc .ap-who { grid-area: who; }
.ap-sc .tm { grid-area: tm; justify-self: end; }
.ap-sc .tm:has(.js-ap-dur:empty) { visibility: hidden; }
.ap-sc .dl { grid-area: dl; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; color: var(--ink); }
.ap-sc .dl:hover { background: var(--soft); }
.ap-sc .dl svg.i { width: 16px; height: 16px; }
.ap-sc .bar { margin-top: 2px; }

.txt { font-size: 19px; line-height: 1.75; color: #20232f; }
.txt > * { margin-block: 0 1.1em; }
.txt p { margin: 0 0 1.1em; }
.txt strong, .txt b { font-weight: 800; color: var(--ink); }
.txt a { text-decoration: underline; text-decoration-color: var(--yel); text-decoration-thickness: 3px; text-underline-offset: 3px; }
.txt h2, .txt h3 { font-weight: 800; letter-spacing: -.025em; line-height: 1.15; margin: 1.4em 0 .5em; }
.txt h2 { font-size: 26px; }
.txt h3 { font-size: 21px; }
.txt img, .txt figure { max-width: 100%; height: auto; }
.txt figure { margin: 1.5em 0; }
.txt blockquote { margin: 1.6em 0; padding: 20px 28px 0; border-top: 3px solid var(--ink); font-weight: 700; letter-spacing: -.02em; font-size: 23px; line-height: 1.3; color: var(--ink); }
.txt blockquote em, .txt blockquote i { font-style: normal; }
.txt blockquote::before { content: "\201C"; display: block; font-size: 64px; line-height: .55; font-weight: 800; color: var(--ink); margin-bottom: 14px; }
.txt blockquote p { margin: 0; }
.txt blockquote cite { display: block; font-weight: 600; font-size: 14px; color: var(--sub); margin-top: 8px; font-style: normal; letter-spacing: 0; }
.txt iframe { max-width: 100%; }
.tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 28px; }
.tags a { font-size: 13px; font-weight: 700; background: var(--soft); padding: 7px 13px; border-radius: 999px; }
.tags a:hover { background: var(--yel-soft); }
.rel { padding-block: 30px 0; }

/* Centrada */
.ce-head { max-width: 700px; margin: 0 auto; display: grid; gap: 16px; padding-block: 34px 24px; }
.ce-tags { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13px; }
.ce-tags b { font-weight: 800; text-transform: uppercase; letter-spacing: .06em; font-size: 12px; }
.ce-tags a { color: var(--sub); }
.ce-head .h { font-size: 40px; line-height: 1.08; letter-spacing: -.03em; }
.ce-act { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; }
.gnews { font-size: 13px; font-weight: 700; border: 1.5px solid var(--ink); border-radius: 999px; padding: 7px 14px; }
.ce-fig { max-width: 1100px; margin: 0 auto; }
.ce-fig .ph { aspect-ratio: 16 / 9; }
.ce-body { max-width: 700px; margin: 0 auto; padding-top: 26px; }
/* Centrada: peu de foto sobre la foto (a baix a la dreta), fotos del text més amples que la columna i cites amb cometes grans */
.ce-fig { position: relative; }
.ce-fig figcaption { text-align: left; font-size: 12px; color: var(--sub); margin-top: 9px; }
figcaption b { font-weight: 700; color: var(--ink); }
.ce-body .txt .wp-block-image, .ce-body .txt figure.wp-caption, .ce-body .txt .wp-block-gallery { width: min(1000px, calc(100vw - 32px)); max-width: none; margin-inline: calc((100% - min(1000px, calc(100vw - 32px))) / 2); margin-block: 2em; }
.ce-body .txt .wp-block-image img, .ce-body .txt figure.wp-caption img { width: 100%; height: auto; display: block; }
.ce-body .txt .wp-block-image figcaption, .ce-body .txt figure.wp-caption figcaption { text-align: left; font-size: 12px; color: var(--sub); margin-top: 8px; }
.ce-body .txt blockquote { width: min(900px, calc(100vw - 32px)); margin: 2.2em calc((100% - min(900px, calc(100vw - 32px))) / 2); padding: 8px 76px 8px 84px; border-top: 0; position: relative; font-weight: 500; font-style: italic; font-size: 25px; line-height: 1.35; letter-spacing: -.01em; color: #3b4050; }
.ce-body .txt blockquote::before { content: "\201C"; position: absolute; left: 0; top: -10px; font-size: 92px; line-height: 1; font-style: normal; font-weight: 800; color: #6b7384; margin: 0; }
.ce-body .txt blockquote::after { content: "\201D"; position: absolute; right: 0; bottom: -34px; font-size: 92px; line-height: 1; font-style: normal; font-weight: 800; color: #6b7384; }
.ce-body .txt blockquote cite { font-style: normal; font-weight: 700; color: var(--sub); margin-top: 10px; }
@media (max-width: 720px) {
	.ce-body .txt blockquote { padding: 4px 40px 4px 48px; font-size: 20px; }
	.ce-body .txt blockquote::before, .ce-body .txt blockquote::after { font-size: 60px; }
	.ce-body .txt blockquote::after { bottom: -22px; }
}
.to-author { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 14px; padding-bottom: 16px; margin-bottom: 18px; border-bottom: 1px solid var(--rule); }
.to-av { width: 44px; height: 44px; border-radius: 50%; background: var(--navy); color: #fff; display: grid; place-items: center; font-weight: 800; font-size: 14px; }
.to-author b { display: block; font-weight: 800; }
.to-author small { color: var(--sub); font-size: 13px; }
.to-author .share { margin-left: auto; }

/* Explicada */
.vx-head { max-width: 960px; display: grid; gap: 16px; padding-block: 0 26px; }
.vx-k { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; font-size: 12.5px; letter-spacing: .1em; text-transform: uppercase; }
.vx-k::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--yel); }
.vx-head .h { font-size: 62px; line-height: .98; letter-spacing: -.045em; }
.vx-sum { border-top: 3px solid var(--ink); padding-top: 14px; margin-bottom: 26px; }
.vx-sum h2 { margin: 0 0 10px; font-weight: 800; font-size: 20px; letter-spacing: -.02em; }
.vx-sum ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.vx-sum li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 10px; align-items: start; font-weight: 600; font-size: 16.5px; line-height: 1.4; }
.vx-sum li b { width: 26px; height: 26px; border-radius: 50%; background: var(--yel); display: grid; place-items: center; font-weight: 800; font-size: 13px; }

/* Clàssica */
.to-head { max-width: 1000px; display: grid; gap: 14px; padding-block: 0 22px; }
.tpl-to .to-head .h { font-weight: 600; font-size: 46px; letter-spacing: -.03em; }
.to-fig figcaption { text-align: right; }

/* Gran format */
.gf-hero { margin: 0 0 0; }
.gf-hero .ph { aspect-ratio: 21 / 9; max-height: 76vh; }
.gf-head { max-width: 880px; margin: 0 auto; text-align: center; display: grid; gap: 16px; justify-items: center; padding-block: 10px 22px; }
.gf-head .crumbs { justify-content: center; }
.gf-head .h { font-size: 58px; line-height: 1.02; letter-spacing: -.04em; }
.gf-head .dek { font-size: 21px; max-width: 62ch; }
.gf-body { max-width: 720px; margin: 0 auto; padding-bottom: 10px; }
.gf-body .txt > p:first-of-type::first-letter { float: left; font-weight: 800; font-size: 84px; line-height: .8; margin: 8px 12px 0 0; }

/* Entrevista */
.int-head { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 44px; align-items: center; padding-block: 24px 30px; border-bottom: 1px solid var(--rule); }
.int-head figure img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.int-head figcaption { font-size: 12px; }
.int-txt { display: grid; gap: 16px; min-width: 0; }
.int-who { font-weight: 800; font-size: 22px; letter-spacing: -.02em; }
.int-head .h { font-size: 52px; line-height: 1.03; letter-spacing: -.04em; }
.int-head .ap { margin-bottom: 0; }

/* Breu */
.br-head { display: grid; gap: 12px; padding-block: 0 8px; }
.br-head .h { font-size: 38px; line-height: 1.08; letter-spacing: -.03em; }
.br-label { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--navy); }
.br-label::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--yel); }
.claus { border-top: 1px solid var(--ink); padding-top: 14px; margin: 10px 0 22px; }
.claus h3 { margin: 0 0 8px; font-weight: 800; font-size: 12.5px; letter-spacing: .09em; text-transform: uppercase; }
.br-thumb { float: right; width: 260px; margin: 6px 0 14px 24px; }
.br-thumb .ph { aspect-ratio: 4 / 3; }
.br-body .a-main::after { content: ""; display: table; clear: both; }

/* ---------- Arxius, pàgines ---------- */
.arch-head { display: grid; gap: 10px; padding-block: 0 10px; }
.arch-head .h { font-size: 44px; letter-spacing: -.035em; }
.big2 { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 24px; align-items: center; margin-bottom: 28px; }
.big2 .ph { aspect-ratio: 4 / 3; }
.big2 .h { font-size: 30px; line-height: 1.08; margin: 10px 0; }
.big2 p { margin: 0 0 10px; color: #34384a; }
.arch .g4 { row-gap: 30px; }
.pag { margin: 34px 0 10px; }
.pag ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.pag a, .pag span { display: inline-grid; place-items: center; min-width: 40px; height: 40px; padding: 0 12px; border-radius: 999px; background: var(--soft); font-weight: 700; font-size: 14px; }
.pag .current { background: var(--ink); color: #fff; }
.pg { max-width: 760px; padding-block: 30px; }
.pg-title { font-size: 44px; margin-bottom: 20px; }

/* ---------- Responsive ---------- */
@media (max-width: 1280px) { .hdr-top { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); } }
@media (max-width: 1080px) {
	.hero { grid-template-columns: minmax(0, 1fr); }
	.hero-side { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; height: auto; min-height: 0; overflow: visible; }
	.hs, .hs:first-child { border-top: 0; padding: 0; }
	.hs.img { display: grid; }
	.hs.img .ph { flex: none; aspect-ratio: 16 / 9; min-height: 0; }
	.quad, .g4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
			.two, .a-body { grid-template-columns: minmax(0, 1fr); }
	.rail, .side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.side .avui-card { position: static; }
	.mdc-track { grid-auto-columns: calc((100% - 2 * 16px) / 2.5); gap: 16px; }
	.car-track { grid-auto-columns: calc((100% - 2 * 18px) / 2.6); gap: 18px; }
	.avui-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mega-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ftr .cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.int-head { grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 28px; }
	.sp-pill { display: none; }
	.a-main { max-width: none; }
}
@media (max-width: 720px) {
	.in { padding-inline: 16px; }
	body { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
	.avui .in { padding-inline: 16px; }
	.avui-bar { gap: 10px; }
	.avui-bar .x, .avui-bar .wl { display: none; }
	.avui-bar { justify-content: space-between; }
	.avui-bar .tg { margin-left: 0; }
	.avui.open .avui-x { display: none; }
	.hdr-top { padding-inline: 12px; min-height: 60px; gap: 6px; }
	.hdr.sc .hdr-top { min-height: 48px; }
	.hdr-l .ib, .hdr-r .soc, .live-btn .t { display: none; }
	.sec-btn { padding: 9px; border-radius: 50%; }
	.sec-btn .t { display: none; }
	.live-btn { padding: 6px; margin-left: 0; }
	.logo .wm { height: 19px; }
	.hdr.sc .logo .wm { height: 16px; }
	.avui-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
	.hero { padding-top: 12px; }
	.hero-big { aspect-ratio: 4 / 5; margin-inline: -16px; }
	.hero-big .h { font-size: 28px; }
	.hero-big .ov { padding: 90px 16px 18px; }
	.hero-side { grid-template-columns: minmax(0, 1fr); gap: 0; }
	.hs, .hs:first-child { padding: 14px 0; border-bottom: 1px solid var(--rule); }
	.hs.img { grid-template-columns: minmax(0, 1fr) 112px; column-gap: 14px; }
	.hs.img .ph { grid-column: 2; grid-row: 1 / span 3; aspect-ratio: 1; margin: 0; }
	.hs .h { font-size: 17px; }
	.duo { grid-template-columns: minmax(0, 1fr); gap: 20px; }
	.duo .h { font-size: 23px; }
	.quad, .g3, .g4 { grid-template-columns: minmax(0, 1fr); gap: 0; }
	.quad .card, .g3 .card, .g4 .card { grid-template-columns: minmax(0, 1fr) 112px; column-gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--rule); }
	.quad .card .ph, .g3 .card .ph, .g4 .card .ph { grid-column: 2; grid-row: 1 / span 3; aspect-ratio: 1; margin: 0; }
	.card .h { font-size: 17px; }
	.card .bdg { right: 6px; bottom: 6px; gap: 4px; }
	.card .aud { padding: 4px 7px 4px 5px; font-size: 11px; }
	.quad .ad { max-width: 300px; width: 100%; margin: 16px auto; }
	.quad .ent, .g3 .ent, .g4 .ent { margin: 14px 0; }
		.rail, .side { grid-template-columns: minmax(0, 1fr); }
	.mdc-nav { display: none; }
	.mdc-track { grid-auto-columns: 72%; gap: 14px; }
	.mdc-item .mt { font-size: 17px; }
	.car-track { grid-auto-columns: 64%; gap: 14px; }
	.car-track .card .h { font-size: 16.5px; }
	.chan { grid-template-columns: minmax(0, 1fr); padding: 22px 18px; }
	.chan .h { font-size: 23px; }
	.cb { flex: 1 1 100%; justify-content: center; }
	.mega-cols { grid-template-columns: minmax(0, 1fr); gap: 26px; }
	.mega .bigl a { font-size: 22px; }
	.mega-search input { font-size: 19px; }
	.ftr .cols { grid-template-columns: minmax(0, 1fr); }
	.a-head .h, .to-head .h, .tpl-to .to-head .h, .ce-head .h, .int-head .h, .gf-head .h { font-size: 31px; }
	.vx-head .h { font-size: 34px; }
	.br-head .h { font-size: 27px; }
	.dek, .gf-head .dek { font-size: 17px; }
	.share a span, .share button span { display: none; }
	.share a, .share button { width: 38px; padding: 0; justify-content: center; }
	.a-fig .ph, .vx-fig .ph, .to-fig .ph, .ce-fig .ph { aspect-ratio: 4 / 3; margin-inline: -16px; }
	.gf-hero .ph { aspect-ratio: 4 / 3; }
	/* Reproductor de la notícia al mòbil: com una app de pòdcast. Qui parla a dalt, barra amb els temps als extrems, i a sota velocitat · −15 play +30 · descarrega i comparteix. */
	.ap { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); grid-template-areas: "who who who" "bar bar bar" "tm tm tm" "spd ctl ic"; gap: 0 8px; }
	.ap-who { margin-bottom: 10px; }
	.ap .bar { margin-top: 0; }
	.ap .tm { justify-self: stretch; justify-content: space-between; margin: 5px 0 6px; font-size: 11px; }
	.ap .tm .sep { display: none; }
	.ap-tools { display: contents; }
	.ap-ic-row { grid-area: ic; justify-self: end; gap: 4px; }
	.ap-ic-row a, .ap-ic-row button { width: 32px; height: 32px; }
	.ap-ic-row svg.i { width: 17px; height: 17px; }
	.ap .spd { grid-area: spd; justify-self: start; }
	.ap-ctl { gap: 6px; }
	.ap .play { width: 40px; height: 40px; }
	.ap .play svg.i { width: 15px; height: 15px; }
	.ap-skip { width: 32px; height: 32px; }
	.ap-vol { display: none; }
	.ap.ap-sc { grid-template-areas: "play who tm dl" "play bar bar bar"; gap: 4px 10px; }
	.ap.ap-sc .tm { justify-self: end; justify-content: flex-start; margin: 0; }
	.ap.ap-sc .play { width: 36px; height: 36px; }
	.txt { font-size: 17.5px; }
	.txt blockquote { font-size: 19px; padding-inline: 18px; }
	.txt blockquote::before { font-size: 52px; }
	.gf-body .txt > p:first-of-type::first-letter { font-size: 60px; }
	.avui-card.wide-avui .avui-grid, .avui-card.wide-avui .qlinks { grid-template-columns: minmax(0, 1fr); }
	.int-head { grid-template-columns: minmax(0, 1fr); gap: 18px; }
	.int-head figure img { aspect-ratio: 4 / 3; }
	.br-thumb { float: none; width: 100%; margin: 0 0 14px; }
	.to-author .share { margin-left: 0; }
	.big2 { grid-template-columns: minmax(0, 1fr); }
	.arch-head .h { font-size: 32px; }
	.sp { grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; border-radius: 12px; padding: 10px 6px 8px 8px; bottom: calc(8px + env(safe-area-inset-bottom, 0px)); width: calc(100% - 16px); }
	.sp-nav, .sp-time, .sp-pill, .sp-speed, .sp-vol, .sp .js-sp-min { display: none; }
	.sp-tools { margin: 0; padding: 0; border: 0; }
	.sp-ctl { gap: 0; }
	.sp-cov { width: 44px; height: 44px; }
	.sp-play { width: 42px; height: 42px; margin: 0 2px; }
	.sp-ib { width: 34px; height: 34px; }
}
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; }
	.mdc-track, .car-track { scroll-behavior: auto; }
}
.gf-hero figcaption { max-width: 1308px; margin: 9px auto 0; padding-inline: 24px; }
@media (max-width: 720px) { .gf-hero figcaption { padding-inline: 16px; } }

/* ---------- Programes i directe ---------- */
.btn-y { display: inline-flex; align-items: center; gap: 10px; background: var(--yel); color: #111; border-radius: 999px; padding: 11px 20px 11px 11px; font-weight: 800; font-size: 15px; }
.btn-y .pb { width: 32px; height: 32px; border-radius: 50%; background: #111; color: var(--yel); display: grid; place-items: center; }
.btn-y .pb svg.i { width: 12px; height: 12px; }
.btn-o { display: inline-flex; align-items: center; gap: 8px; border: 1.5px solid var(--ink); border-radius: 999px; padding: 11px 18px; font-weight: 700; font-size: 15px; }
.btn-o svg.i { width: 17px; height: 17px; }
.btn-o:hover { background: var(--yel-soft); }
.ic-btn, .shr-btn.ic { width: 46px; height: 46px; padding: 0; border-radius: 50%; border: 1.5px solid var(--ink); display: grid; place-items: center; color: var(--ink); }
.ic-btn:hover, .shr-btn.ic:hover { background: var(--yel-soft); }
.ic-btn svg.i, .shr-btn.ic svg.i { width: 20px; height: 20px; }
.js-ep .pz, .js-ep.on .pl { display: none; }
.js-ep.on .pz { display: block; }

.hosts { font-size: 18px; font-weight: 700; }
.sched { display: inline-flex; align-items: center; gap: 8px; margin-top: 12px; background: var(--yel-soft); border-radius: 999px; padding: 7px 14px; font-weight: 700; font-size: 14px; }
.sched svg.i { width: 16px; height: 16px; }
.p-cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
/* Capçalera de pàgina en blau marí (programes, La ràdio): text a l'esquerra, imatge a la dreta; cantonades rectes */
.pgh { position: relative; background: var(--navy); color: #fff; overflow: hidden; isolation: isolate; margin-bottom: 30px; }
.pgh-bg { position: absolute; inset: 0; z-index: 0; } /* no z-index negatiu: Chrome no el pintava sobre el fons */
.pgh-bg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pgh-cover .pgh-bg img { filter: blur(50px) saturate(1.3); transform: scale(1.4); opacity: .5; }
.pgh-cover .pgh-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--navy) 0%, rgba(21, 32, 71, .6) 50%, rgba(21, 32, 71, .25) 100%); }
.pgh-photo .pgh-bg { left: 40%; }
.pgh-photo .pgh-bg img { -webkit-mask-image: linear-gradient(90deg, transparent, #000 45%); mask-image: linear-gradient(90deg, transparent, #000 45%); }
.pgh-in { position: relative; z-index: 1; }
.pgh .crumbs { color: rgba(255, 255, 255, .65); }
.pgh .crumbs a:hover { color: #fff; }
.pgh-g { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 40px; align-items: center; padding: 26px 0 38px; min-height: 300px; }
.pgh-txt { display: grid; gap: 8px; justify-items: start; max-width: 680px; }
.pgh .k { color: var(--yel); font-weight: 800; }
.pgh .h { margin: 0; font-size: clamp(34px, 4.2vw, 54px); line-height: 1; letter-spacing: -.04em; color: #fff; }
.pgh .hosts { font-size: 17px; }
.pgh .sched { background: rgba(255, 255, 255, .13); color: #fff; margin-top: 2px; }
.pgh .desc { margin: 4px 0 0; font-size: 16.5px; line-height: 1.55; color: rgba(255, 255, 255, .82); max-width: 60ch; }
.pgh .p-cta { margin-top: 12px; }
.pgh .ic-btn, .pgh .shr-btn.ic { border-color: rgba(255, 255, 255, .7); color: #fff; }
.pgh .ic-btn:hover, .pgh .shr-btn.ic:hover { background: rgba(255, 255, 255, .14); }
.pgh-cv { width: 250px; aspect-ratio: 1; box-shadow: 0 30px 50px -24px rgba(0, 0, 0, .7); }
.pgh-photo .pgh-g { grid-template-columns: minmax(0, 1fr); min-height: 340px; }
.pgh-photo .pgh-txt { max-width: 560px; }
.pgh-none .pgh-g { grid-template-columns: minmax(0, 1fr); min-height: 240px; }
.pgh-slim .pgh-g { min-height: 0; padding: 12px 0 24px; }
.pgh-slim .h { font-size: clamp(28px, 3vw, 38px); }
.pgh .srch { justify-self: stretch; width: 100%; max-width: 560px; border-color: transparent; margin-top: 10px; }
.pgh .btn-y .pb svg.i { width: 14px; height: 14px; }
/* El temps (pàgina /el-temps/, bloc nrll/temps) */
.pgh-temps .pgh-txt { max-width: none; justify-items: stretch; }
.tp-now { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px 40px; align-items: center; margin-top: 10px; }
.tp-now-main { display: flex; align-items: center; gap: 18px; }
.tp-now-main > div { display: grid; }
.tp-now svg.tp-big { width: 92px; height: 92px; stroke-width: 1.4; color: var(--yel); }
.tp-temp { font-size: 72px; font-weight: 800; letter-spacing: -.05em; line-height: .95; }
.tp-lab { font-size: 20px; font-weight: 700; margin-top: 6px; }
.tp-feel { font-size: 14px; color: rgba(255, 255, 255, .75); margin-top: 4px; }
.tp-kv { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, auto); gap: 8px 26px; }
.tp-kv li { display: grid; gap: 2px; font-size: 13px; color: rgba(255, 255, 255, .7); border-left: 1px solid rgba(255, 255, 255, .2); padding-left: 14px; }
.tp-kv b { font-size: 16px; color: #fff; white-space: nowrap; }
.tp { padding-bottom: 20px; }
.tp-nav { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.tp-nav a { border: 1.5px solid var(--ink); border-radius: 999px; padding: 7px 14px; font-weight: 700; font-size: 14px; }
.tp-nav a:hover { background: var(--yel); border-color: var(--yel); }
.tp-txt { font-size: 18px; line-height: 1.6; max-width: 72ch; margin: 0 0 34px; }
.tp-sec { margin-bottom: 40px; scroll-margin-top: 80px; }
.tp-sec h2 { font-size: 26px; letter-spacing: -.02em; margin: 0 0 16px; }
.tp-sec h3 { font-size: 18px; margin: 28px 0 12px; }
.tp-hours { display: flex; gap: 6px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; -webkit-overflow-scrolling: touch; }
.tp-h { flex: 0 0 76px; scroll-snap-align: start; display: grid; justify-items: center; gap: 6px; background: var(--soft); padding: 12px 6px; text-align: center; }
.tp-h.now { background: var(--yel); }
.tp-h .t { font-size: 12px; font-weight: 700; color: var(--sub); }
.tp-h.now .t { color: #111; }
.tp-h svg.i { width: 28px; height: 28px; stroke-width: 1.6; }
.tp-h b { font-size: 17px; }
.tp-h small { font-size: 11px; color: var(--navy); font-weight: 700; min-height: 14px; }
.tp-days { list-style: none; margin: 0; padding: 0; }
.tp-days li { display: grid; grid-template-columns: 120px 220px 110px minmax(0, 1fr) 120px; gap: 16px; align-items: center; padding: 12px 0; border-top: 1px solid var(--rule); font-size: 15px; }
.tp-days li:last-child { border-bottom: 1px solid var(--rule); }
.tp-days .d { display: grid; }
.tp-days .d small { color: var(--sub); font-size: 12px; }
.tp-days .ic { display: flex; align-items: center; gap: 10px; }
.tp-days .ic svg.i { width: 30px; height: 30px; stroke-width: 1.6; }
.tp-days .ic small { font-size: 13px; color: #34384a; }
.tp-days .tp-pop { font-size: 13px; font-weight: 700; color: var(--navy); }
.tp-days .rng { display: grid; grid-template-columns: 38px minmax(0, 1fr) 38px; align-items: center; gap: 10px; }
.tp-days .rng .lo { color: var(--sub); font-weight: 600; text-align: right; }
.tp-days .rng .hi { font-weight: 800; }
.tp-days .rng > i { display: block; height: 6px; background: var(--rule); border-radius: 6px; position: relative; }
.tp-days .rng > i > i { position: absolute; top: 0; bottom: 0; background: linear-gradient(90deg, var(--navy-2), var(--yel)); border-radius: 6px; }
.tp-days .w { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: #34384a; justify-self: end; }
.tp-days .w svg.i { width: 16px; height: 16px; }
.tp-chart { margin: 0; background: var(--soft); padding: 14px 10px 6px; }
.tp-chart svg { width: 100%; height: auto; display: block; font: 700 13px var(--f); }
.tp-chart polyline { fill: none; stroke-width: 2.5; stroke-linejoin: round; }
.tp-chart .mx { stroke: #e0b800; }
.tp-chart .mn { stroke: var(--navy); }
.tp-chart circle.mx { fill: var(--yel); stroke: #e0b800; }
.tp-chart circle.mn { fill: var(--navy); }
.tp-chart text { text-anchor: middle; fill: var(--ink); stroke: none; }
.tp-chart text.mn { fill: var(--navy); }
.tp-chart text.dl { fill: var(--sub); font-weight: 600; }
.tp-chart figcaption { display: flex; gap: 18px; justify-content: center; font-size: 12px; font-weight: 700; margin-top: 6px; }
.tp-chart figcaption span::before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 6px; background: var(--yel); }
.tp-chart figcaption .mn::before { background: var(--navy); }
.tp-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.tp-card { background: var(--soft); padding: 16px 18px; position: relative; display: grid; align-content: start; gap: 4px; }
.tp-card h3 { margin: 0; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--sub); display: flex; align-items: center; gap: 7px; }
.tp-card h3 svg.i { width: 17px; height: 17px; }
.tp-card b { font-size: 26px; letter-spacing: -.02em; }
.tp-card b small { font-size: 14px; font-weight: 600; color: var(--sub); margin-left: 2px; }
.tp-card p { margin: 0; font-size: 14px; color: #34384a; line-height: 1.4; }
.tp-arrow { position: absolute; right: 18px; top: 16px; width: 34px; height: 34px; border-radius: 50%; background: var(--navy); color: #fff; display: grid; place-items: center; }
.tp-arrow svg.i { width: 18px; height: 18px; }
.tp-sea, .tp-act { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tp-act .bar { display: block; height: 6px; background: var(--rule); border-radius: 6px; margin-top: 8px; overflow: hidden; }
.tp-act .bar i { display: block; height: 100%; background: var(--yel); }
.tp-src { font-size: 13px; color: var(--sub); }
/* Eleccions (pàgina /eleccions/, bloc nrll/eleccions) */
.pgh-el .pgh-txt { max-width: none; justify-items: stretch; }
.pgh-el .pgh-cv { box-shadow: 0 24px 40px -22px rgba(0, 0, 0, .6); }
.el-top { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 12px; }
.el-stat { display: grid; gap: 4px; border-left: 1px solid rgba(255, 255, 255, .25); padding-left: 16px; }
.el-stat span { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: rgba(255, 255, 255, .7); font-weight: 700; }
.el-stat b { font-size: 40px; letter-spacing: -.04em; line-height: 1; }
.el-stat small { font-size: 13px; color: rgba(255, 255, 255, .75); }
.el-stat .bar { display: block; height: 6px; background: rgba(255, 255, 255, .2); border-radius: 6px; margin-top: 6px; max-width: 260px; overflow: hidden; }
.el-stat .bar i { display: block; height: 100%; background: var(--yel); }
.el-wait { margin: 8px 0 0; font-size: 17px; line-height: 1.5; max-width: 62ch; color: rgba(255, 255, 255, .85); }
.el { padding-bottom: 20px; }
.el-sec { margin-bottom: 44px; scroll-margin-top: 80px; }
.el-h { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
.el-h h2, .el-sec > h2 { font-size: 26px; letter-spacing: -.02em; margin: 0; }
.el-sec > h2 { margin-bottom: 16px; }
.el-h span { font-size: 14px; color: var(--sub); font-weight: 600; }
.el-sec h3 { font-size: 18px; margin: 28px 0 12px; }
.el-res { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 22px; align-items: start; }
.el-chart { background: var(--soft); display: grid; grid-template-rows: auto minmax(0, 1fr) auto; min-height: 420px; }
.el-chart-h { padding: 18px 22px 0; display: grid; gap: 2px; }
.el-chart-h b { font-size: 17px; }
.el-chart-h span { font-size: 14px; color: var(--sub); font-weight: 600; }
.el-bars { display: flex; align-items: flex-end; justify-content: space-around; gap: 8px; padding: 26px 18px 10px; min-height: 260px; }
.el-bar { flex: 1 1 0; min-width: 0; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; justify-items: center; align-items: end; height: 100%; gap: 6px; }
.el-bar .v { font-size: 12.5px; font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }
.el-bar i { display: block; width: 70%; max-width: 44px; background: var(--c); align-self: end; }
.el-bar .n { font-size: 11px; font-weight: 700; color: #34384a; text-transform: uppercase; letter-spacing: .02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.el-empty { align-self: center; justify-self: center; color: var(--sub); font-size: 15px; margin: 0; width: 100%; text-align: center; }
.el-chart-f { border-top: 1px solid var(--rule); padding: 12px 22px; display: flex; justify-content: center; gap: 24px; font-size: 14px; color: var(--sub); font-weight: 600; }
.el-chart-f b { color: var(--ink); }
.el-chart-f span { white-space: nowrap; }
.el-tbl { border: 1px solid var(--rule); }
.el-tbl table { width: 100%; border-collapse: collapse; font-size: 15px; }
.el-tbl th { text-align: left; padding: 14px 18px; background: var(--soft); font-size: 15px; font-weight: 800; border-bottom: 1px solid var(--rule); }
.el-tbl th:not(:first-child), .el-tbl td:not(:first-child) { text-align: center; }
.el-tbl td { padding: 11px 18px; border-bottom: 1px solid var(--rule); vertical-align: middle; font-variant-numeric: tabular-nums; }
.el-tbl tr:nth-child(even) td { background: #fafafc; }
.el-tbl td .sw { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 10px; vertical-align: middle; }
.el-tbl td b { font-size: 15px; }
.el-tbl td small { display: block; font-size: 12px; color: var(--sub); padding-left: 20px; }
.el-tbl td .df { font-style: normal; font-size: 12px; font-weight: 700; margin-left: 6px; color: var(--sub); }
.el-tbl td .df.up { color: #117a3a; }
.el-tbl td .df.down { color: #b42318; }
.el-tbl tr.more { display: none; }
.el-tbl.open tr.more { display: table-row; }
.el-more { display: flex; align-items: center; gap: 10px; margin-left: auto; padding: 14px 18px; font-weight: 700; font-size: 15px; color: var(--sub); }
.el-more:hover { color: var(--ink); }
.el-more b { font-size: 20px; font-weight: 400; line-height: 1; }
.el-more .t2, .el-tbl.open .el-more .t1 { display: none; }
.el-tbl.open .el-more .t2 { display: inline; }
.el-tbl.open .el-more b { transform: rotate(45deg); }
.el-prev .el-chart { min-height: 360px; }
.el-note { font-size: 13px; color: var(--sub); margin: 12px 0 0; }
.el-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.el-card { background: var(--soft); padding: 14px 16px; display: grid; gap: 2px; }
.el-card span { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--sub); font-weight: 700; }
.el-card b { font-size: 26px; letter-spacing: -.02em; }
.el-card small { font-size: 13px; color: #34384a; }
.el-hores { border-collapse: collapse; min-width: 320px; font-size: 15px; }
.el-hores th, .el-hores td { text-align: left; padding: 8px 18px 8px 0; border-bottom: 1px solid var(--rule); }
.el-hores th { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--sub); }
.el-txt { max-width: 72ch; }
.btn-w { display: inline-flex; align-items: center; border: 1.5px solid rgba(255, 255, 255, .7); color: #fff; border-radius: 999px; padding: 11px 20px; font-weight: 800; font-size: 15px; }
.btn-w:hover { background: rgba(255, 255, 255, .14); }
.plat { padding-block: 24px 6px; }
.plat h3 { margin: 0 0 14px; font-weight: 800; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--sub); }
.pills { display: flex; flex-wrap: wrap; gap: 12px; }
.pill { display: inline-flex; align-items: center; gap: 12px; background: #fff; border-radius: 999px; padding: 7px 18px 7px 7px; font-weight: 600; font-size: 16px; box-shadow: 0 3px 14px rgba(16, 22, 56, .13); transition: box-shadow .15s; }
.pill:hover { box-shadow: 0 6px 18px rgba(16, 22, 56, .22); }
.pill .ic { width: 36px; height: 36px; border-radius: 50%; background: var(--yel); color: #111; display: grid; place-items: center; }
.pill .ic svg.i { width: 19px; height: 19px; }
.p-grid { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 44px; padding-top: 30px; }
.fitxa { background: var(--soft); padding: 22px; display: grid; gap: 14px; align-content: start; align-self: start; position: sticky; top: 90px; }
.fitxa h3 { margin: 0; font-weight: 800; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--sub); }
.fitxa dl { margin: 0; display: grid; gap: 12px; }
.fitxa dt { font-size: 12.5px; color: var(--sub); font-weight: 600; }
.fitxa dd { margin: 0; font-weight: 800; }

.eps { list-style: none; margin: 0; padding: 0; }
.ep { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto auto; gap: 14px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--rule); }
.ep .cv { width: 52px; height: 52px; }
.ep .et { display: block; font-weight: 800; font-size: 15.5px; line-height: 1.3; }
.ep .et:hover { text-decoration: underline; }
.ep small { display: block; color: var(--sub); font-size: 13px; margin-top: 2px; }
.ep small::first-letter { text-transform: uppercase; }
.ep .du { font-size: 13px; color: var(--sub); font-variant-numeric: tabular-nums; }
.ep .pb { width: 40px; height: 40px; border-radius: 50%; background: var(--yel); color: #111; display: grid; place-items: center; transition: transform .15s; }
.ep .pb svg.i { width: 13px; height: 13px; }
.ep .pb:hover { transform: scale(1.06); }
.ep .pb.on { background: var(--ink); color: var(--yel); }

.live { background: var(--navy); color: #fff; margin-top: 22px; padding: 34px; display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 34px; position: relative; overflow: hidden; }
.live::after { content: ""; position: absolute; right: -80px; top: -80px; width: 340px; height: 340px; border-radius: 50%; background: radial-gradient(circle, rgba(249, 224, 0, .28), transparent 65%); pointer-events: none; }
.live-main { position: relative; z-index: 1; min-width: 0; }
.live .tag { display: inline-flex; align-items: center; gap: 8px; background: #ff5247; color: #fff; font-weight: 800; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; padding: 6px 11px; border-radius: 999px; }
.live .tag i { width: 7px; height: 7px; border-radius: 50%; background: #fff; }
.live .h { font-size: 58px; letter-spacing: -.045em; line-height: 1; margin: 16px 0 8px; }
.live .nx { color: #c4cbec; font-size: 16px; margin: 0; }
.live-ctrl { display: flex; align-items: center; gap: 22px; margin-top: 26px; }
.live-ctrl .big { width: 84px; height: 84px; border-radius: 50%; background: var(--yel); color: #111; display: grid; place-items: center; flex: none; box-shadow: 0 10px 30px -10px rgba(249, 224, 0, .7); transition: transform .15s; }
.live-ctrl .big:hover { transform: scale(1.05); }
.live-ctrl .big svg.i { width: 28px; height: 28px; }
.live-ctrl .big .pz, .live-ctrl .big.on .pl { display: none; }
.live-ctrl .big.on .pz { display: block; }
.wave { display: flex; align-items: center; gap: 4px; height: 56px; flex: 1; overflow: hidden; }
.wave span { width: 5px; flex: none; border-radius: 3px; background: var(--yel); opacity: .9; }
.live.on .wave span { animation: nrll-eq 1.1s ease-in-out infinite; }
.freq { display: flex; gap: 10px; margin-top: 22px; flex-wrap: wrap; }
.freq span { background: rgba(255, 255, 255, .1); border-radius: 999px; padding: 7px 13px; font-weight: 700; font-size: 13px; }
.today-box { background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .12); padding: 18px; position: relative; z-index: 1; align-self: start; }
.today-box h3 { margin: 0 0 6px; font-weight: 800; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: #c4cbec; }
.today-box .empty { color: #c4cbec; }
.slot { display: grid; grid-template-columns: 54px minmax(0, 1fr); gap: 10px; padding: 11px 0; border-top: 1px solid rgba(255, 255, 255, .12); }
.slot:hover b { text-decoration: underline; }
.slot time { font-weight: 800; font-size: 13px; color: var(--yel); font-variant-numeric: tabular-nums; }
.slot b { display: block; font-weight: 800; font-size: 15.5px; }
.slot small { color: #aeb6dc; font-size: 12.5px; }
.slot.now { background: rgba(249, 224, 0, .12); margin-inline: -10px; padding-inline: 10px; border-radius: 10px; border-top-color: transparent; }
.slot.fill b { font-weight: 600; color: #d6dbf3; }
.slot.fill:hover b { text-decoration: none; }

.prg-track { grid-auto-columns: calc((100% - 5 * 20px) / 5.5); }
.prg .ph { aspect-ratio: 1; }
.prg .mt { font-size: 16px; font-weight: 800; }
.prg small { color: var(--sub); font-size: 12.5px; margin-top: -4px; }
.progs { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 26px 18px; padding-bottom: 20px; }
.progs .prg { display: grid; gap: 9px; align-content: start; min-width: 0; }
.progs .prg:hover .mt { text-decoration: underline; }
.progs-hem { margin-top: 26px; }
.progs-hem .sec-h { margin-bottom: 6px; }
.progs-hem-p { margin: 0 0 18px; color: var(--sub); font-size: 15px; }
.progs-hem .prg .ph { opacity: .85; }
.progs-head { display: grid; gap: 10px; padding-block: 0 26px; }
.progs-head .h { font-size: 34px; letter-spacing: -.03em; }
.progs-head p { margin: 0; color: #34384a; font-size: 17px; max-width: 60ch; }

@media (max-width: 1080px) {
	.p-grid, .live { grid-template-columns: minmax(0, 1fr); }
	.pgh-cv { width: 200px; }
	.tp-grid, .tp-sea, .tp-act { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.el-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.el-res { gap: 14px; }
	.el-bars { padding: 20px 10px 8px; }
	.tp-days li { grid-template-columns: 100px 170px 90px minmax(0, 1fr) 100px; gap: 10px; }
	.progs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.prg-track { grid-auto-columns: calc((100% - 3 * 16px) / 3.5); }
	.fitxa { position: static; }
}
@media (max-width: 720px) {
	.live { padding: 24px 20px; margin-inline: -16px; }
	.live .h { font-size: 38px; }
	.live-ctrl .big { width: 68px; height: 68px; }
	.wave { height: 40px; gap: 3px; }
	.wave span { width: 4px; }
	.progs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 14px; }
	.progs-head .h { font-size: 28px; }
	.prg-track { grid-auto-columns: 42%; }
	.ep { grid-template-columns: 48px minmax(0, 1fr) auto; gap: 12px; }
	.ep .cv { width: 48px; height: 48px; }
	.ep .du { display: none; }
	.pgh-g { grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 14px 0 26px; min-height: 0; }
	.pgh-cv { width: 120px; order: -1; }
	.el-top { grid-template-columns: minmax(0, 1fr); gap: 12px; }
	.el-stat { border-left: 0; padding-left: 0; border-top: 1px solid rgba(255, 255, 255, .2); padding-top: 10px; }
	.el-stat b { font-size: 32px; }
	.el-res { grid-template-columns: minmax(0, 1fr); }
	.el-chart { min-height: 0; }
	.el-bars { min-height: 200px; padding: 18px 6px 6px; gap: 4px; }
	.el-bar .v { font-size: 11px; }
	.el-bar .n { font-size: 10px; }
	.el-tbl th, .el-tbl td { padding: 10px 12px; }
	.el-tbl td small { display: none; }
	.el-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
	.el-card b { font-size: 22px; }
	.tp-now { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	.tp-now svg.tp-big { width: 64px; height: 64px; }
	.tp-temp { font-size: 56px; }
	.tp-kv { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 14px; }
	.tp-kv li { padding-left: 10px; }
	.tp-txt { font-size: 16px; }
	.tp-days li { grid-template-columns: 78px minmax(0, 1fr) auto; grid-template-areas: "d ic pop" "d rng rng" "d w w"; gap: 4px 10px; padding: 10px 0; }
	.tp-days .d { grid-area: d; }
	.tp-days .ic { grid-area: ic; }
	.tp-days .ic small { display: none; }
	.tp-days .tp-pop { grid-area: pop; }
	.tp-days .rng { grid-area: rng; }
	.tp-days .w { grid-area: w; justify-self: start; }
	.tp-grid, .tp-sea, .tp-act { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.tp-card { padding: 12px 14px; }
	.tp-card b { font-size: 22px; }
	.pgh .h { font-size: 34px; }
	.pgh .p-cta { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; justify-self: stretch; gap: 8px; }
	.pgh .btn-y { font-size: 14px; padding: 8px 14px 8px 8px; justify-content: center; }
	.pgh .btn-y .pb { width: 30px; height: 30px; }
	.pgh .ic-btn, .pgh .shr-btn.ic { width: 44px; height: 44px; }
	.pgh-photo .pgh-bg { left: 0; }
	.pgh-photo .pgh-bg img { opacity: .38; -webkit-mask-image: linear-gradient(180deg, #000 20%, transparent); mask-image: linear-gradient(180deg, #000 20%, transparent); }
	.pgh-photo .pgh-g { padding-top: 70px; }
	.pill { font-size: 15px; padding-right: 14px; }
}
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.chips a { border: 1.5px solid var(--rule); border-radius: 999px; padding: 7px 13px; font-weight: 700; font-size: 13.5px; }
.chips a:hover { border-color: var(--ink); }
.chips a.on { background: var(--ink); border-color: var(--ink); color: #fff; }
.eps-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; }
@media (max-width: 1080px) { .eps-2 { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Vídeo sobre la foto (es reprodueix al mateix lloc) ---------- */
.vf-play { position: absolute; left: 16px; bottom: 16px; z-index: 2; display: inline-flex; align-items: center; gap: 10px; background: #fff; color: #111; border-radius: 999px; padding: 6px 16px 6px 6px; font-weight: 800; font-size: 14.5px; box-shadow: 0 4px 16px rgba(0, 0, 0, .25); transition: transform .15s; }
.vf-play:hover { transform: scale(1.04); }
.vf-play .pb { width: 38px; height: 38px; border-radius: 50%; background: var(--yel); display: grid; place-items: center; }
.vf-play .pb svg.i { width: 14px; height: 14px; }
.ph.vf-on { aspect-ratio: 16 / 9; height: auto; max-height: none; background: #000; }
.ph.vf-on iframe, .ph.vf-on video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: #000; }
.ph.vf-v { aspect-ratio: auto; height: min(82vh, 780px); background: var(--navy); }
.ph.vf-v iframe, .ph.vf-v video { position: static; display: block; height: 100%; width: auto; aspect-ratio: 9 / 16; max-width: 100%; margin: 0 auto; }
.ph.vf-instagram { aspect-ratio: auto; height: auto; background: var(--soft); padding: 18px 0; }
.ph.vf-instagram iframe { position: static; display: block; width: min(440px, 100%); height: 780px; margin: 0 auto; background: #fff; border: 1px solid var(--rule); border-radius: 6px; }
.nrll-embed { margin: 26px 0; }
.nrll-embed .ph { aspect-ratio: 16 / 9; }
.nrll-embed.is-vertical .ph { aspect-ratio: 9 / 16; max-width: 400px; }
.int-head .ph.vf-on { aspect-ratio: 4 / 5; }
.int-head .ph.vf-on.vf-v { aspect-ratio: auto; }
@media (max-width: 720px) {
	.vf-play { left: 12px; bottom: 12px; font-size: 13.5px; padding: 5px 14px 5px 5px; gap: 8px; }
	.vf-play .pb { width: 32px; height: 32px; }
	.ph.vf-v { height: min(78vh, 640px); }
	.ph.vf-instagram { padding: 0; }
	.ph.vf-instagram iframe { width: 100%; border: 0; border-radius: 0; }
	.int-head .ph.vf-on { aspect-ratio: 16 / 9; }
}

/* ---------- Programació setmanal ---------- */
.week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; padding-bottom: 10px; }
.wday { background: var(--soft); padding: 14px 12px; display: grid; gap: 8px; align-content: start; min-width: 0; }
.wday h2 { margin: 0 0 4px; font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.wday h2 span { background: var(--ink); color: #fff; border-radius: 999px; padding: 3px 8px; font-size: 10.5px; letter-spacing: .06em; }
.wday.today { background: var(--yel-soft); }
.wslot { display: grid; gap: 2px; background: #fff; padding: 10px; border-radius: 8px; box-shadow: 0 1px 2px rgba(14, 17, 32, .06); }
.wslot:hover b { text-decoration: underline; }
.wslot time { font-size: 12px; font-weight: 800; color: var(--navy); font-variant-numeric: tabular-nums; }
.wslot b { font-weight: 800; font-size: 14.5px; line-height: 1.25; }
.wslot small { font-size: 12px; color: var(--sub); }
.wslot em { font-style: normal; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #c0261b; }
.wslot.now { outline: 2px solid var(--ink); }
.wslot.fill { background: rgba(255, 255, 255, .55); box-shadow: none; }
.wslot.fill b { font-weight: 700; color: #4b5068; }
.wslot.fill:hover b { text-decoration: none; }
.wday .empty { font-size: 13px; }
.wextra { padding-top: 26px; }
.wextra .h { font-size: 20px; margin-bottom: 10px; }
.wextra ul { margin: 0; padding-left: 18px; display: grid; gap: 6px; color: var(--sub); }
.wextra b { color: var(--ink); }
@media (max-width: 1080px) {
	.week { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 44%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
	.week::-webkit-scrollbar { display: none; }
	.wday { scroll-snap-align: start; order: var(--o, 0); }
}
@media (max-width: 720px) { .week { grid-auto-columns: 78%; } }

/* ---------- Programació per dies (com la SER): barra de dies, línia vertical amb els botons d'escoltar i targetes ---------- */
.dtabs { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); background: var(--soft); margin-bottom: 40px; overflow-x: auto; scrollbar-width: none; }
.dtabs::-webkit-scrollbar { display: none; }
.dtab { position: relative; display: grid; gap: 2px; justify-items: center; padding: 15px 10px 13px; text-align: center; min-width: 0; color: var(--ink); }
.dtab .dn { font-weight: 800; font-size: 16px; color: #5b6075; }
.dtab .dd { font-size: 12.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #8a8fa3; }
.dtab:hover .dn { color: var(--ink); }
.dtab[aria-selected="true"] { background: var(--ink); }
.dtab[aria-selected="true"] .dn { color: var(--yel); }
.dtab[aria-selected="true"] .dd { color: #fff; }
.dtab[aria-selected="true"]::after { content: ""; position: absolute; left: 50%; bottom: -7px; width: 14px; height: 14px; background: var(--ink); transform: translateX(-50%) rotate(45deg); }
.dpanel[hidden] { display: none; }
.dlist { list-style: none; margin: 0 auto; padding: 4px 0; max-width: 920px; position: relative; }
.dlist::before { content: ""; position: absolute; left: 31px; top: 0; bottom: 0; width: 2px; background: #e3e5ee; }
.drow { position: relative; display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 26px; align-items: center; padding: 16px 0; }
.dplay { width: 64px; height: 64px; display: grid; place-items: center; }
.dplay .pb { width: 64px; height: 64px; border-radius: 50%; background: #fff; box-shadow: 0 8px 22px -8px rgba(14, 17, 32, .4); display: grid; place-items: center; transition: transform .15s; }
.dplay .pb:hover { transform: scale(1.05); }
.dplay .yc { width: 40px; height: 40px; border-radius: 50%; background: var(--yel); color: #111; display: grid; place-items: center; }
.dplay .pb.on .yc { background: var(--ink); color: var(--yel); }
.dplay svg.i { width: 15px; height: 15px; }
.dplay .pb .pz, .dplay .pb.on .pl { display: none; }
.dplay .pb.on .pz { display: block; }
.dplay .dot { width: 12px; height: 12px; border-radius: 50%; background: #dfe2ec; border: 2px solid #fff; }
.dcard { display: grid; grid-template-columns: 112px minmax(0, 1fr) auto; gap: 20px; align-items: center; background: var(--soft); border-radius: 10px; padding: 14px 28px 14px 0; min-height: 100px; }
.dcard .cv { width: 112px; height: 112px; display: block; overflow: hidden; align-self: start; margin-top: -16px; border-radius: 10px 0 0 10px; background: #e4e6ee; }
.dcard .cv img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dcard .dtt { display: block; font-weight: 800; font-size: 16px; line-height: 1.25; text-transform: uppercase; letter-spacing: .01em; }
a.dtt:hover { text-decoration: underline; }
.dcard small { display: block; color: var(--sub); font-size: 14px; margin-top: 3px; }
.dcard small.epl { font-size: 13px; }
.dcard small a { text-decoration: underline; text-underline-offset: 3px; }
.dcard .em { display: inline-block; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #c0261b; margin-top: 4px; }
.dcard time { display: grid; justify-items: end; gap: 2px; font-weight: 800; font-size: 50px; line-height: 1; color: #c9ccd8; font-variant-numeric: tabular-nums; }
.dcard time span { font-size: 12px; font-weight: 700; letter-spacing: .03em; color: #a3a7b8; }
.drow.fill .dtt { color: #4b5068; }
.drow.fill .dcard { background: #f6f7fa; }
.drow.future .dcard { opacity: .8; }
.drow.now .dcard { background: var(--yel-soft); }
.drow.now .dcard time { color: #b9a800; }
@media (max-width: 900px) {
	.dtabs { display: flex; margin-bottom: 30px; }
	.dtab { flex: none; min-width: 118px; }
}
@media (max-width: 720px) {
	.dlist::before { left: 23px; }
	.drow { grid-template-columns: 48px minmax(0, 1fr); gap: 12px; padding: 12px 0; }
	.dplay, .dplay .pb { width: 48px; height: 48px; }
	.dplay .yc { width: 32px; height: 32px; }
	.dplay svg.i { width: 12px; height: 12px; }
	.dcard { grid-template-columns: 76px minmax(0, 1fr) auto; gap: 12px; padding: 10px 14px 10px 0; min-height: 84px; }
	.dcard .cv { width: 76px; height: 76px; margin-top: -12px; }
	.dcard .dtt { font-size: 14px; }
	.dcard small { font-size: 12.5px; }
	.dcard time { font-size: 28px; }
	.dcard time span { font-size: 10.5px; }
	.dtab .dn { font-size: 15px; }
}

/* ---------- Podcasts: cercador ---------- */
.srch { display: flex; align-items: center; gap: 8px; max-width: 560px; border: 1.5px solid var(--ink); border-radius: 999px; padding: 4px 6px 4px 18px; background: #fff; }
.srch input { flex: 1; min-width: 0; border: 0; background: none; font: inherit; font-size: 16px; color: var(--ink); outline: none; }
.srch button { width: 40px; height: 40px; border-radius: 50%; background: var(--yel); color: #111; display: grid; place-items: center; flex: none; }
.srch button svg.i { width: 18px; height: 18px; }
.pod-head .srch { margin-top: 8px; }
.eps-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-bottom: 8px; }
.eps-tools .srch { flex: 1 1 280px; max-width: 420px; }
.eps-tools .chips { margin: 0; }

/* ---------- Enllaç de la bio (Instagram) ---------- */
.bio { max-width: 760px; padding-block: 22px 10px; }
.bio-top { display: grid; gap: 10px; }
.bio-live { display: flex; align-items: center; gap: 14px; background: var(--navy); color: #fff; border-radius: 18px; padding: 12px 16px 12px 12px; text-align: left; }
.bio-live .pb { width: 52px; height: 52px; border-radius: 50%; background: var(--yel); color: #111; display: grid; place-items: center; flex: none; }
.bio-live .pb svg.i { width: 18px; height: 18px; }
.bio-live .pz, .bio-live.on .pl { display: none; }
.bio-live.on .pz { display: block; }
.bio-live b { display: block; font-size: 18px; font-weight: 800; }
.bio-live small { color: #c4cbec; font-size: 13px; }
.bio-btn { display: flex; align-items: center; justify-content: center; gap: 10px; border: 1.5px solid var(--ink); border-radius: 999px; padding: 13px 18px; font-weight: 800; font-size: 15.5px; }
.bio-btn:hover { background: var(--yel-soft); }
.bio-h { font-size: 24px; font-weight: 800; letter-spacing: -.02em; margin: 28px 0 14px; }
.bio-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.bio-it { display: grid; gap: 8px; align-content: start; }
.bio-it .ph { aspect-ratio: 1; }
.bio-it .bt { font-weight: 700; font-size: 14px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.bio-it:hover .bt { text-decoration: underline; }
.bio-more { text-align: center; margin: 26px 0 0; }
@media (max-width: 720px) {
	.bio-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 10px; }
	.bio-it .bt { font-size: 13.5px; }
}

/* ---------- Necrològiques ---------- */
.obit-list { list-style: none; margin: 0; padding: 0; display: grid; }
.obit-list li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 14px 0; border-bottom: 1px solid var(--rule); }
.obit-list b { font-weight: 800; font-size: 18px; }
.obit-list span { color: var(--sub); font-weight: 600; }
.obit-list small { grid-column: 1 / -1; color: var(--sub); font-size: 14px; }
.obit-list small::first-letter { text-transform: uppercase; }
.obit-src { color: var(--sub); font-size: 14px; margin-top: 18px; }
.obit-src a { text-decoration: underline; }

/* ---------- Portada: titular gran a dalt i tres columnes ---------- */
.hero-t { padding-block: 26px 6px; }
.ht-head { text-align: center; display: grid; justify-items: center; gap: 12px; padding-bottom: 22px; }
.ht-head .h { font-size: clamp(32px, 3.9vw, 54px); line-height: 1.04; letter-spacing: -.04em; max-width: 25ch; }
.ht-head .dek { font-size: 19px; line-height: 1.45; color: #34384a; max-width: 62ch; margin: 0; }
.ht-head .by { font-size: 13px; }
.ht-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 3.5fr) minmax(0, 3.5fr); border-top: 1px solid var(--ink); padding-top: 14px; align-items: stretch; }
.ht-img { aspect-ratio: 1; }
/* Regla fixa: les columnes del costat no aporten alçada; mai acaben més avall que la foto principal */
.ht-col { display: flex; flex-direction: column; height: 0; min-height: 100%; overflow: hidden; padding-inline: 22px; border-left: 1px solid var(--rule); }
.ht-col:first-of-type { margin-left: 22px; }
.ht-col:last-child { padding-right: 0; }
.ht-it { flex: none; display: grid; gap: 7px; padding: 14px 0; border-top: 1px solid var(--rule); min-width: 0; }
.ht-it:first-child { border-top: 0; padding-top: 0; }
.ht-it:last-child { padding-bottom: 0; }
.ht-it.img { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }
.ht-it.img .ph { flex: 1 1 auto; min-height: 90px; margin-bottom: 4px; }
.ht-it.img > :not(.ph) { flex-shrink: 0; }
.ht-it .h { font-size: 20px; line-height: 1.18; letter-spacing: -.02em; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.ht-it .dk { margin: 0; font-size: 15px; line-height: 1.45; color: #34384a; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 1080px) {
	.ht-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); row-gap: 18px; }
	.ht-img { grid-column: 1 / -1; aspect-ratio: 16 / 9; }
	.ht-col { height: auto; min-height: 0; overflow: visible; }
	.ht-col:first-of-type { margin-left: 0; padding-left: 0; border-left: 0; }
	.ht-it.img .ph { flex: none; aspect-ratio: 16 / 9; }
}
@media (max-width: 720px) {
	.ht-head { padding-bottom: 16px; gap: 10px; }
	.ht-head .dek { font-size: 17px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
	.ht-grid { grid-template-columns: minmax(0, 1fr); }
	.ht-img { margin-inline: -16px; }
	.ht-col { padding-inline: 0; border-left: 0; }
	.ht-col + .ht-col { border-top: 1px solid var(--rule); padding-top: 14px; }
	.ht-it .h { font-size: 19px; }
}

.qlinks .qbox a.map { display: grid; gap: 2px; text-decoration: none; }
.qlinks .qbox a.map span { display: inline-flex; align-items: center; gap: 5px; font-weight: 600; font-size: 13.5px; text-decoration: underline; text-underline-offset: 3px; }
.qbox a.map svg.i { width: 15px; height: 15px; flex: none; }
html.nrll-loading::before { content: ""; position: fixed; z-index: 100; top: 0; left: 0; height: 3px; width: 100%; background: linear-gradient(90deg, var(--navy) 0 40%, var(--yel) 40% 60%, var(--navy) 60%); background-size: 200% 100%; animation: nrll-load 1s linear infinite; }
@keyframes nrll-load { from { background-position: 100% 0; } to { background-position: -100% 0; } }

/* ---------- Vídeos verticals: fila de la portada ---------- */
.shorts-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; padding-top: 12px; border-top: 1px solid var(--ink); }
.shorts-h .h { font-size: 24px; letter-spacing: -.03em; }
.car-nav button { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; }
.car-nav button:hover:not(:disabled) { background: var(--soft); }
.car-nav button:disabled { opacity: .3; cursor: default; }
.shorts-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 4 * 18px) / 4.4); gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; scroll-behavior: smooth; padding: 3px; margin: -3px; }
.shorts-track::-webkit-scrollbar { display: none; }
.short { position: relative; aspect-ratio: 9 / 16; border-radius: 14px; overflow: hidden; background: #111; color: #fff; scroll-snap-align: start; display: block; outline: 3px solid transparent; outline-offset: -3px; transition: outline-color .15s; }
.short:hover, .short:focus-visible { outline-color: var(--yel); }
.short .ph { position: absolute; inset: 0; background: #222; }
.short .ph img { transition: transform .5s ease; }
.short:hover .ph img { transform: scale(1.04); }
.short::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(0, 0, 0, .55) 70%, rgba(0, 0, 0, .9)); pointer-events: none; }
.short-pl { position: absolute; left: 50%; top: 50%; z-index: 2; width: 64px; height: 64px; margin: -32px 0 0 -32px; border-radius: 50%; background: rgba(255, 255, 255, .85); color: #111; display: grid; place-items: center; opacity: 0; transform: scale(.85); transition: opacity .2s, transform .2s; }
.short-pl svg.i { width: 24px; height: 24px; }
.short:hover .short-pl, .short:focus-visible .short-pl { opacity: 1; transform: none; }
.short-t { position: absolute; left: 16px; right: 16px; bottom: 46px; z-index: 1; font-weight: 800; font-size: 18px; line-height: 1.22; letter-spacing: -.01em; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.short-m { position: absolute; left: 16px; bottom: 16px; z-index: 1; display: inline-flex; align-items: center; gap: 7px; font-weight: 600; font-size: 14px; }
.short-m svg.i { width: 16px; height: 16px; }
.short-m i { width: 5px; height: 5px; border-radius: 50%; background: var(--yel); }
@media (max-width: 1080px) { .shorts-track { grid-auto-columns: calc((100% - 2 * 14px) / 2.6); gap: 14px; } }
@media (max-width: 720px) { .shorts-track { grid-auto-columns: 62%; gap: 12px; } .short-t { font-size: 17px; } .shorts-h .car-nav { display: none; } }

/* ---------- Vídeos verticals: visor a pantalla completa ---------- */
.sv { position: fixed; inset: 0; z-index: 70; background: rgba(10, 11, 16, .72); display: grid; padding: 18px; opacity: 0; transition: opacity .25s ease; }
.sv.open { opacity: 1; }
.sv-box { position: relative; background: #1d1e24; color: #fff; border-radius: 18px; display: grid; grid-template-rows: auto minmax(0, 1fr); overflow: hidden; }
.sv-top { display: flex; align-items: center; justify-content: space-between; padding: 18px 26px 0; }
.sv-brand { font-weight: 800; font-size: 22px; letter-spacing: -.02em; }
.sv-brand b { color: var(--yel); }
.sv-x { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; color: #fff; }
.sv-x:hover { background: rgba(255, 255, 255, .1); }
.sv-x svg.i { width: 24px; height: 24px; }
.sv-stage { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 40px; padding: 16px 90px 22px 26px; min-height: 0; }
.sv-media { grid-column: 2; position: relative; height: min(calc(100vh - 140px), 920px); aspect-ratio: 9 / 16; border-radius: 12px; overflow: hidden; background: #000; }
.sv-media video, .sv-media iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: cover; background: #000; }
.sv-media.ig { background: #fff; }
.sv-media.ig iframe { object-fit: initial; }
.sv-vol { position: absolute; top: 12px; right: 12px; z-index: 3; width: 40px; height: 40px; border-radius: 50%; background: #fff; color: #111; display: grid; place-items: center; }
.sv-vol svg.i { width: 19px; height: 19px; }
.sv-vol .off { display: none; }
.sv-media.muted .sv-vol .on { display: none; }
.sv-media.muted .sv-vol .off { display: block; }
.sv-bigplay { position: absolute; left: 50%; top: 50%; z-index: 2; width: 72px; height: 72px; margin: -36px 0 0 -36px; border-radius: 50%; background: rgba(255, 255, 255, .9); color: #111; display: none; place-items: center; }
.sv-bigplay svg.i { width: 26px; height: 26px; }
.sv-media.paused .sv-bigplay { display: grid; }
.sv-bar { position: absolute; left: 14px; right: 14px; bottom: 12px; z-index: 3; height: 5px; border-radius: 3px; background: rgba(255, 255, 255, .35); overflow: hidden; }
.sv-bar i { position: absolute; inset: 0 auto 0 0; width: 0; background: #fff; border-radius: 3px; }
.sv-media.frame .sv-vol, .sv-media.frame .sv-bar, .sv-media.frame .sv-bigplay { display: none; }
.sv-info { grid-column: 3; max-width: 380px; display: grid; gap: 14px; align-content: center; }
.sv-t { margin: 0; font-weight: 800; font-size: 26px; line-height: 1.2; letter-spacing: -.02em; }
.sv-d { margin: 0; font-size: 15.5px; line-height: 1.5; color: #d7d9e2; display: -webkit-box; -webkit-line-clamp: 8; -webkit-box-orient: vertical; overflow: hidden; }
.sv-date { font-size: 13px; color: #a9adbd; }
.sv-act { display: flex; gap: 10px; align-items: center; margin-top: 4px; }
.sv-read { display: inline-flex; align-items: center; gap: 8px; background: var(--yel); color: #111; border-radius: 999px; padding: 10px 16px; font-weight: 800; font-size: 14px; }
.sv-read svg.i { width: 16px; height: 16px; }
.sv-share { width: 42px; height: 42px; border-radius: 50%; border: 1.5px solid rgba(255, 255, 255, .5); color: #fff; display: grid; place-items: center; }
.sv-share:hover { border-color: #fff; }
.sv-share svg.i { width: 18px; height: 18px; }
.sv-share.copied { background: var(--yel); color: #111; border-color: var(--yel); }
.sv-nav { position: absolute; right: 26px; bottom: 26px; display: grid; gap: 14px; }
.sv-nav button { width: 48px; height: 48px; border-radius: 50%; border: 1.5px solid rgba(255, 255, 255, .55); color: #fff; display: grid; place-items: center; }
.sv-nav button:hover:not(:disabled) { border-color: #fff; background: rgba(255, 255, 255, .08); }
.sv-nav button:disabled { opacity: .3; cursor: default; }
.sv-nav svg.i { width: 22px; height: 22px; }
.sv-nav .up svg.i { transform: rotate(-90deg); }
.sv-nav .down svg.i { transform: rotate(90deg); }
@media (max-width: 900px) {
	.sv { padding: 0; }
	.sv-box { border-radius: 0; grid-template-rows: minmax(0, 1fr); }
	.sv-top { position: absolute; z-index: 5; inset: 0 0 auto 0; padding: 12px 12px 0 16px; text-shadow: 0 1px 6px rgba(0, 0, 0, .5); }
	.sv-stage { display: block; padding: 0; height: 100%; }
	.sv-media { height: 100%; width: 100%; aspect-ratio: auto; border-radius: 0; }
	.sv-vol { top: 64px; }
	.sv-info { position: absolute; z-index: 4; left: 0; right: 0; bottom: 0; max-width: none; padding: 80px 70px 28px 16px; background: linear-gradient(transparent, rgba(0, 0, 0, .85)); gap: 8px; }
	.sv-t { font-size: 19px; }
	.sv-d { -webkit-line-clamp: 2; font-size: 14px; }
	.sv-bar { bottom: 6px; left: 8px; right: 8px; height: 3px; }
	.sv-nav { right: 10px; bottom: 90px; gap: 10px; }
	.sv-nav button { width: 42px; height: 42px; background: rgba(0, 0, 0, .3); }
}
body.admin-bar .sv { top: 32px; }
@media (max-width: 782px) { body.admin-bar .sv { top: 46px; } }

/* Amb l'scroll bloquejat (menú o visor de vídeos) desapareix la barra lateral: el reproductor fix no s'ha de moure */
html.nrll-lock .sp { left: calc(50% - var(--sbw, 0px) / 2); }
/* Cascos de les targetes: posen l'àudio al reproductor fix */
.aud.js-ep { cursor: pointer; transition: background .15s, transform .15s; }
.aud.js-ep:hover { background: var(--yel); transform: scale(1.05); }
.aud.js-ep.on { background: var(--yel); }
.aud.js-ep.on svg.i { animation: nrll-pulse-ico 1s ease-in-out infinite; }
@keyframes nrll-pulse-ico { 50% { opacity: .35; } }

/* Capçalera groga en fer scroll: més baixa i amb els botons més petits */
.sec-btn, .live-btn, .live-btn .pb, .hdr .ib { transition: padding .3s ease, width .3s ease, height .3s ease; }
.hdr.sc .sec-btn { padding: 6px 13px 6px 10px; }
.hdr.sc .live-btn { padding: 4px 13px 4px 4px; }
.hdr.sc .live-btn .pb { width: 24px; height: 24px; }
.hdr.sc .ib { width: 34px; height: 34px; }
@media (max-width: 720px) { .hdr.sc .sec-btn { padding: 7px; } .hdr.sc .live-btn { padding: 4px; } }

/* ---------- Línia de sota el titular: autor i dates a l'esquerra; compartir i Google a la dreta ---------- */
.a-meta { text-align: left; }
.a-meta .by { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 0; }
.a-meta .by .dt::before, .a-meta .by .upd::before { content: "·"; margin: 0 8px; }
.m-act { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.shr { position: relative; }
.shr-btn { height: 40px; padding: 0 13px 0 16px; border-radius: 999px; border: 1.5px solid var(--ink); display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: 14px; color: var(--ink); transition: background .15s; }
.shr-btn svg.i { width: 20px; height: 20px; }
.shr-btn:hover, .shr-btn[aria-expanded="true"] { background: var(--yel-soft); }
.shr-menu { position: absolute; z-index: 30; top: calc(100% + 10px); right: -6px; min-width: 232px; background: #fff; border: 1px solid var(--rule); border-radius: 16px; box-shadow: 0 18px 40px -16px rgba(14, 17, 32, .35); padding: 8px; display: grid; gap: 2px; }
.shr-menu::before { content: ""; position: absolute; top: -7px; right: 20px; width: 12px; height: 12px; background: #fff; border-left: 1px solid var(--rule); border-top: 1px solid var(--rule); transform: rotate(45deg); }
.shr-menu[hidden] { display: none; }
.shr-menu a, .shr-menu button { display: flex; align-items: center; gap: 12px; width: 100%; padding: 9px 10px; border-radius: 10px; font-size: 15.5px; font-weight: 500; text-align: left; color: var(--ink); }
.shr-menu a:hover, .shr-menu button:hover { background: var(--soft); }
.shr-menu svg.i { width: 21px; height: 21px; }
.shr-menu .copied { background: var(--yel-soft); }
@media (max-width: 720px) {
	/* Autor i data a l'esquerra (la data pot baixar de línia), «Comparteix» a la dreta, a la mateixa alçada */
	.a-meta { flex-wrap: nowrap; gap: 10px; }
	.a-meta .by { flex: 1 1 auto; min-width: 0; }
	.a-meta .by .dt { flex-basis: 100%; }
	.a-meta .by .dt::before { content: none; margin: 0; }
	.m-act { flex: none; margin-left: auto; }
	.shr-btn { height: 36px; padding: 0 11px 0 13px; font-size: 13.5px; gap: 6px; }
	.shr-btn svg.i { width: 18px; height: 18px; }
	.shr-menu { right: 0; }
}

/* ---------- Portada · Estil betevé: molt d'aire, titulars grans però no tan negres, secció en minúscules, caixes grises ---------- */
.bt .h { font-weight: 500; letter-spacing: -.02em; }
.bt .k { text-transform: lowercase; letter-spacing: 0; font-weight: 500; font-size: 15px; color: var(--navy); }
.bt .sec-h { border-top: 0; padding-top: 0; }
.bt .sec-h .h { font-weight: 700; }
.bt .blk { padding-block: 22px 4px; }
.bt .hero { gap: 20px; }
.bt .hero-big .h { font-weight: 500; font-size: 44px; letter-spacing: -.025em; }
.bt .hero-big .k { color: var(--yel); }
.bt .hero-side { gap: 12px; }
.bt .hs { background: var(--soft); padding: 16px 18px; border-top: 0; }
.bt .hs:first-child { padding-top: 16px; }
.bt .hs:last-child { padding-bottom: 16px; }
.bt .hs.img { padding: 0 0 16px; }
.bt .hs.img > :not(.ph) { margin-inline: 18px; }
.bt .hs .h { font-size: 19px; font-weight: 500; }
.bt .duo { gap: 20px; }
.bt .card .h { font-size: 19px; line-height: 1.28; }
.bt .duo .card .h { font-size: 36px; line-height: 1.12; }
.bt .quad, .bt .g4 { gap: 20px; }
@media (max-width: 720px) {
	.bt .hero-big .h { font-size: 28px; }
	.bt .card .h { font-size: 17px; }
	.bt .duo .card .h { font-size: 24px; }
}

/* Vídeos horitzontals de la categoria Vídeos: al visor, apaïsats */
.sv-media.wide { aspect-ratio: 16 / 9; height: auto; width: min(58vw, 1000px); }
@media (max-width: 900px) { .sv-media.wide { width: 100%; height: 100%; aspect-ratio: auto; } .sv-media.wide iframe, .sv-media.wide video { object-fit: contain; } }

/* Opcions de la plantilla */
.hdr-plain .hdr.sc { background: #fff; }
.sp-auto .sp { transition: transform .35s ease, opacity .35s ease; }
.sp-auto .sp:not(.on):not(.track) { transform: translate(-50%, 160%); opacity: 0; pointer-events: none; }

/* ---------- Accés: icona a la capçalera, finestra emergent i menú de l'usuari ---------- */
.usr-in svg.i { width: 21px; height: 21px; }
.usr { position: relative; }
.usr-av { width: 36px; height: 36px; border-radius: 50%; background: var(--navy); color: #fff; font-weight: 800; font-size: 13px; letter-spacing: .02em; display: grid; place-items: center; }
.usr-menu { position: absolute; z-index: 40; top: calc(100% + 10px); right: 0; min-width: 220px; background: #fff; border: 1px solid var(--rule); border-radius: 14px; box-shadow: 0 18px 40px -16px rgba(14, 17, 32, .35); padding: 8px; display: grid; }
.usr-menu[hidden] { display: none; }
.usr-menu .usr-name { padding: 8px 10px 10px; font-weight: 800; font-size: 14px; border-bottom: 1px solid var(--rule); margin-bottom: 4px; }
.usr-menu a { padding: 9px 10px; border-radius: 9px; font-weight: 600; font-size: 14.5px; }
.usr-menu a:hover { background: var(--soft); }
.lgn { position: fixed; inset: 0; z-index: 80; background: rgba(10, 12, 24, .55); display: grid; place-items: center; padding: 16px; opacity: 0; transition: opacity .2s ease; }
.lgn.open { opacity: 1; }
.lgn-box { position: relative; width: min(420px, 100%); background: #fff; border-radius: 18px; padding: 34px 30px 28px; display: grid; gap: 14px; box-shadow: 0 30px 70px -30px rgba(5, 10, 40, .6); transform: translateY(10px); transition: transform .25s ease; }
.lgn.open .lgn-box { transform: none; }
.lgn-x { position: absolute; top: 12px; right: 12px; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; }
.lgn-x:hover { background: var(--soft); }
.lgn-logo { height: 24px; width: auto; justify-self: center; margin-bottom: 4px; }
.lgn-box h2 { margin: 0; text-align: center; font-weight: 800; font-size: 24px; letter-spacing: -.02em; }
.lgn-sub { margin: -8px 0 6px; text-align: center; color: var(--sub); font-size: 14px; }
.lgn-f { display: grid; gap: 6px; font-weight: 700; font-size: 13.5px; }
.lgn-f input { width: 100%; height: 48px; border: 1.5px solid #cfd2dc; border-radius: 10px; padding: 0 14px; font: inherit; font-weight: 500; font-size: 16px; background: #fff; }
.lgn-f input:focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 3px var(--yel-soft); }
.lgn-pw { position: relative; display: block; }
.lgn-pw input { padding-right: 76px; }
.lgn-pw button { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); font-size: 13px; font-weight: 700; color: var(--sub); padding: 6px 8px; border-radius: 8px; }
.lgn-pw button:hover { background: var(--soft); color: var(--ink); }
.lgn-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 13.5px; }
.lgn-row a { text-decoration: underline; text-underline-offset: 3px; color: var(--sub); }
.lgn-rm { display: inline-flex; align-items: center; gap: 7px; font-weight: 600; }
.lgn-go { height: 50px; border-radius: 999px; background: var(--yel); color: #111; font-weight: 800; font-size: 16px; margin-top: 4px; }
.lgn-go:hover { filter: brightness(.96); }
.mega-acc { display: none; }
@media (max-width: 720px) {
	.hdr-r .usr-in, .hdr-r .usr { display: none; }
	.mega-foot { display: flex; flex-wrap: wrap; gap: 10px; }
	.mega-acc { display: inline-flex; align-items: center; gap: 8px; padding: 11px 16px; border-radius: 999px; border: 1.5px solid var(--ink); font-weight: 700; font-size: 15px; }
	.mega-acc svg.i { width: 19px; height: 19px; }
	.lgn-box { padding: 30px 20px 22px; }
}

/* ---------- Capçalera: Podcasts, missatge i accés ---------- */
.pod-btn { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 16px 0 13px; border-radius: 999px; background: var(--yel); color: var(--navy); font-weight: 600; font-size: 12px; letter-spacing: .07em; text-transform: uppercase; margin-right: 6px; white-space: nowrap; transition: height .3s ease, filter .2s ease; }
.pod-btn svg.i { width: 17px; height: 17px; stroke-width: 1.7; }
.pod-btn:hover { filter: brightness(.96); }
.hdr.sc .pod-btn { height: 34px; background: #fff; }
.hdr .usr-in { background: var(--soft); }
.hdr.sc .usr-in { background: rgba(255, 255, 255, .7); }
.msg-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.msg-f textarea { width: 100%; border: 1.5px solid #cfd2dc; border-radius: 10px; padding: 12px 14px; font: inherit; font-weight: 500; font-size: 16px; line-height: 1.45; resize: vertical; min-height: 120px; background: #fff; }
.msg-f select { width: 100%; height: 48px; border: 1.5px solid #cfd2dc; border-radius: 10px; padding: 0 12px; font: inherit; font-weight: 500; font-size: 16px; background: #fff; color: var(--ink); }
.msg-f textarea:focus, .msg-f select:focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 3px var(--yel-soft); }
.msg-pv { align-items: flex-start; font-size: 13.5px; line-height: 1.4; }
.msg-pv input { margin-top: 2px; flex: none; }
.msg-pv a { text-decoration: underline; text-underline-offset: 3px; }
.msg-st { margin: 0; font-size: 14px; font-weight: 600; min-height: 0; }
.msg-st:empty { display: none; }
.msg-st.err { color: #b42318; }
.msg .lgn-box { width: min(480px, 100%); max-height: calc(100dvh - 32px); overflow-y: auto; }
.msg-ok { display: grid; justify-items: center; text-align: center; gap: 10px; padding: 18px 0 8px; }
.msg-ok h2 { margin: 0; font-weight: 800; font-size: 24px; }
.msg-ok p { margin: 0; color: var(--sub); max-width: 32ch; }
.msg-ic { width: 56px; height: 56px; border-radius: 50%; background: var(--yel); display: grid; place-items: center; }
.msg-ic svg.i { width: 26px; height: 26px; }
.msg-inline .msg-f { display: grid; gap: 14px; }
@media (max-width: 720px) {
	.pod-btn { width: 34px; height: 34px; padding: 0; justify-content: center; margin-right: 0; }
	.pod-btn .t { display: none; }
	.pod-btn svg.i { width: 17px; height: 17px; }
	.hdr.sc .pod-btn { height: 32px; width: 32px; }
	.hdr-r .ib { width: 34px; height: 34px; }
	.logo .wm { height: 18px; }
	.hdr-r { gap: 4px; }
}


/* ---------- Episodi de programa ---------- */
.e-hero .k { color: var(--navy); }
.e-hero .k:hover { text-decoration: underline; }
.e-hero .h { font-size: clamp(30px, 3.4vw, 46px); line-height: 1.05; letter-spacing: -.035em; }
.e-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; color: var(--sub); font-size: 15px; font-weight: 600; }
.e-meta span { display: inline-flex; align-items: center; gap: 6px; }
.e-meta svg.i { width: 16px; height: 16px; }
.e-hero .p-cta { align-items: center; }
.e-hero .btn-y .pz, .e-hero .btn-y.on .pl { display: none; }
.e-hero .btn-y.on .pz { display: block; }
.e-txt { margin-bottom: 34px; }
.e-prog { display: flex; align-items: center; gap: 12px; }
.e-prog img { width: 56px; height: 56px; object-fit: cover; flex: none; }
.e-prog b { font-size: 17px; line-height: 1.2; }
.e-prog:hover b { text-decoration: underline; }
.fitxa .btn-o { justify-content: center; }

/* ---------- Portada en columnes (línies fines entre columnes) ---------- */
.co { padding-block: 26px 6px; }
.co-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid var(--ink); padding-top: 9px; margin-bottom: 16px; }
.co-h .h { font-size: 15px; font-weight: 800; letter-spacing: 0; }
.co-h a { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 13px; }
.co-h a svg.i { width: 14px; height: 14px; }
.co-h a:hover { text-decoration: underline; }
.co-it { display: grid; gap: 7px; align-content: start; min-width: 0; }
.co-it .ph { aspect-ratio: 3 / 2; margin-bottom: 4px; }
.co-it .h { font-size: 19px; line-height: 1.2; letter-spacing: -.02em; }
.co-it .dk { margin: 0; font-size: 14.5px; line-height: 1.45; color: #3a3e4f; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.co-it .by { font-size: 12.5px; color: var(--sub); }
.co-it.sm .h { font-size: 16.5px; }
.co-it.big .ph { aspect-ratio: 16 / 9; }
.co-it.big .h { font-size: 30px; line-height: 1.1; letter-spacing: -.03em; }
.co-it.big .dk { font-size: 16px; -webkit-line-clamp: 3; }
/* Totes les columnes amb el mateix marge (el de fora es compensa): així fan exactament el mateix ample */
.co-row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); margin-inline: -18px; }
.co-c { display: grid; gap: 16px; align-content: start; padding-inline: 18px; border-left: 1px solid var(--rule); min-width: 0; }
.co-c:first-child { border-left: 0; }
.co-c > .co-it + .co-it { border-top: 1px solid var(--rule); padding-top: 16px; }
.co-gran .co-row { grid-auto-flow: row; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.co-sub { margin: 4px 0 -2px; font-size: 13px; font-weight: 800; border-top: 1px solid var(--ink); padding-top: 9px; }
.co-text .co-it .h { font-size: 18.5px; }
/* Obertura: principal gran + dues columnes que mai acaben més avall que la principal */
.co-ob { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 3fr) minmax(0, 3fr); align-items: stretch; padding-top: 22px; }
.co-main { display: grid; gap: 10px; align-content: start; padding-right: 22px; min-width: 0; }
.co-main .ph { aspect-ratio: 4 / 3; margin-bottom: 6px; }
.co-main .h { font-size: clamp(28px, 2.6vw, 38px); line-height: 1.08; letter-spacing: -.035em; }
.co-main .dk { margin: 0; font-size: 16.5px; line-height: 1.5; color: #34384a; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.co-main .by { font-size: 13px; color: var(--sub); }
.co-col { display: flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start; column-gap: 400px; height: 0; min-height: 100%; overflow: hidden; padding-inline: 22px; border-left: 1px solid var(--rule); min-width: 0; }
.co-col:last-child { padding-right: 0; }
.co-col > .co-it { width: 100%; padding-block: 14px; border-top: 1px solid var(--rule); }
.co-col > .co-it:first-child { border-top: 0; padding-top: 0; }
.co-ob .co-it .h { font-size: 19.5px; }
/* Dues columnes: contingut + publicitat fixa a la dreta */
.co-two { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 36px; align-items: start; }
.co-rail { position: sticky; top: 74px; display: grid; gap: 26px; padding-top: 26px; }
.admin-bar .co-rail { top: 106px; }
.co-two .ad-wide { margin-block: 26px 0; }
@media (max-width: 1080px) {
	.co-ob { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); row-gap: 20px; }
	.co-main { grid-column: 1 / -1; padding-right: 0; }
	.co-main .ph { aspect-ratio: 16 / 9; }
	.co-col { height: auto; min-height: 0; overflow: visible; flex-wrap: nowrap; }
	.co-col:first-of-type { padding-left: 0; border-left: 0; }
	.co-quatre .co-row, .co-text .co-row { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 22px; }
	.co-quatre .co-c:nth-child(3), .co-text .co-c:nth-child(3) { border-left: 0; }
	.co-two { grid-template-columns: minmax(0, 1fr); }
	.co-rail { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
	.co-ob { grid-template-columns: minmax(0, 1fr); row-gap: 0; padding-top: 12px; }
	.co-main .ph { margin-inline: -16px; }
	.co-main .h { font-size: 28px; }
	.co-col { padding-inline: 0; border-left: 0; }
	.co-col > .co-it:first-child { border-top: 1px solid var(--rule); padding-top: 14px; }
	.co-row, .co-quatre .co-row, .co-text .co-row, .co-gran .co-row { grid-auto-flow: row; grid-template-columns: minmax(0, 1fr); row-gap: 0; margin-inline: 0; }
	.co-c, .co-quatre .co-c:nth-child(3) { padding: 14px 0 0; border-left: 0; }
	.co-c + .co-c { border-top: 1px solid var(--rule); margin-top: 14px; }
	.co-it.img:not(.big) { grid-template-columns: minmax(0, 1fr) 112px; column-gap: 14px; }
	.co-it.img:not(.big) .ph { grid-column: 2; grid-row: 1 / span 4; aspect-ratio: 1; margin: 0; }
	.co-it:not(.big) .dk { display: none; }
	.co-it .h, .co-ob .co-it .h { font-size: 17px; }
	.co-it.big .h { font-size: 24px; }
	.co-rail { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Pàgines de servei (La ràdio, contacte, publicitat, TV, farmàcies, agenda, textos legals) ---------- */
.pgs { padding-bottom: 40px; }
.pg-head { display: grid; gap: 10px; padding-block: 22px 26px; margin-bottom: 30px; border-bottom: 1px solid var(--ink); }
.pg-head .h { margin: 0; font-size: clamp(30px, 3.2vw, 42px); line-height: 1.08; letter-spacing: -.03em; max-width: 24ch; }
.pg-head .lead { margin: 0; font-size: 19px; line-height: 1.5; color: #34384a; max-width: 62ch; }
.pg-head .upd { margin: 0; color: var(--sub); font-size: 14px; }
/* «La ràdio»: foto gran, xifres, fites, com escoltar-nos i les veus */
.pg-xifres { list-style: none; margin: 0 0 36px; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.pg-xifres li { background: var(--soft); padding: 16px 18px; display: grid; gap: 3px; align-content: start; }
.pg-xifres b { font-weight: 800; font-size: 26px; letter-spacing: -.03em; line-height: 1.1; }
.pg-xifres span { font-size: 13px; color: var(--sub); line-height: 1.3; }
.pg-h2 { margin: 0; font-size: 24px; letter-spacing: -.03em; }
.pg-sec { margin-top: 44px; padding-top: 14px; border-top: 1px solid var(--ink); }
.pg-fites ol { list-style: none; margin: 20px 0 0; padding: 0 0 0 24px; border-left: 2px solid var(--rule); display: grid; gap: 18px; }
.pg-fites li { position: relative; display: grid; gap: 2px; }
.pg-fites li::before { content: ""; position: absolute; left: -32px; top: 5px; width: 12px; height: 12px; border-radius: 50%; background: var(--yel); border: 2px solid var(--ink); }
.pg-fites b { font-weight: 800; font-size: 15px; }
.pg-fites span { color: #34384a; font-size: 15.5px; line-height: 1.45; }
.pg-com-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 20px; }
.pg-com-grid .pg-card { gap: 10px; }
.pg-com-grid .big { font-weight: 800; font-size: 36px; letter-spacing: -.04em; line-height: 1; }
.pg-com-grid .btn-y, .pg-com-grid .btn-o { justify-self: start; }
.pg-com-grid .pills { gap: 8px; }
.pg-com-grid .pill { font-size: 14px; padding: 5px 14px 5px 5px; box-shadow: none; border: 1px solid var(--rule); }
.pg-com-grid .pill .ic { width: 30px; height: 30px; }
.pg-com-grid .pill .ic svg.i { width: 15px; height: 15px; }
.pg-team ul { list-style: none; margin: 20px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 0 24px; }
.pg-team li { display: grid; gap: 1px; padding: 11px 0; border-top: 1px solid var(--rule); }
.pg-team b { font-weight: 800; }
.pg-team span { color: var(--sub); font-size: 13.5px; }
.pg-txt .wp-block-gallery { margin-top: 26px; }
.pg-txt .wp-block-gallery figcaption { font-size: 13px; }
@media (max-width: 900px) {
	.pg-xifres { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.pg-com-grid { grid-template-columns: minmax(0, 1fr); }
	.pg-hero img { aspect-ratio: 16 / 10; }
}
.pg-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 48px; align-items: start; }
.pg-grid.one { grid-template-columns: minmax(0, 780px); }
.pg-grid:has(.pg-toc) { grid-template-columns: 270px minmax(0, 780px); }
.pg-txt { max-width: 780px; }
.pg-txt.legal { font-size: 16.5px; line-height: 1.65; }
.pg-txt.legal h2, .pg-txt.legal h3, .pg-txt.legal h4 { scroll-margin-top: 90px; }
.pg-side { display: grid; gap: 18px; position: sticky; top: 90px; }
.pg-card { display: grid; gap: 12px; align-content: start; background: var(--soft); padding: 22px; }
.pg-card h2 { margin: 0; font-weight: 800; font-size: 22px; letter-spacing: -.02em; }
.pg-card > h3 { margin: 0; font-weight: 800; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--sub); }
.pg-card p { margin: 0; }
.pg-card p a:hover, .pg-list a:hover { text-decoration: underline; }
.pg-card .btn-o { justify-self: start; background: #fff; }
.pg-live { background: var(--navy); color: #fff; }
.pg-live > h3 { color: rgba(255, 255, 255, .7); }
.pg-live p { color: #d7d9e2; }
.pg-live .fq { font-weight: 800; font-size: 56px; line-height: 1; letter-spacing: -.04em; color: var(--yel); }
.pg-live .fq small { font-size: 18px; margin-left: 6px; color: #fff; letter-spacing: 0; }
.pg-live .btn-y { justify-self: start; }
.pgs .btn-y .pz, .pgs .btn-y.on .pl { display: none; }
.pgs .btn-y.on .pz { display: block; }
.pg-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.pg-list li { display: flex; gap: 10px; align-items: flex-start; font-weight: 600; }
.pg-list svg.i { width: 18px; height: 18px; flex: none; margin-top: 2px; }
.pg-soc { display: flex; flex-wrap: wrap; gap: 8px; }
.pg-soc a { width: 40px; height: 40px; border-radius: 50%; background: #fff; display: grid; place-items: center; }
.pg-soc a:hover { background: var(--yel); }
.pg-toc { position: sticky; top: 90px; max-height: calc(100vh - 120px); overflow: auto; }
.pg-toc h3 { margin: 0 0 10px; font-weight: 800; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--sub); }
.pg-toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; font-size: 14px; }
.pg-toc a { display: block; padding: 6px 10px; border-left: 2px solid var(--rule); line-height: 1.35; }
.pg-toc a:hover { border-color: var(--yel); background: var(--soft); }
.pg-toc .l3 a, .pg-toc .l4 a { padding-left: 22px; font-size: 13.5px; color: var(--sub); }
/* Contacte */
.ct-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 30px; align-items: start; }
.ct-form, .pub-form { background: #fff; border: 1px solid var(--rule); padding: 28px; }
.ct-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ct-ic { width: 42px; height: 42px; border-radius: 50%; background: var(--yel); display: grid; place-items: center; }
.ct-ic svg.i { width: 20px; height: 20px; }
.ct-big { font-weight: 800; font-size: 22px; line-height: 1.35; letter-spacing: -.02em; }
.ct-em .ct-ic { background: #ff5247; color: #fff; }
/* TV */
.tv-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 36px; align-items: start; }
.tv-media { position: relative; aspect-ratio: 16 / 9; background: #000; }
.tv-media img { width: 100%; height: 100%; object-fit: cover; }
.tv-empty { display: grid; place-items: center; color: #fff; }
.tv-now { display: grid; gap: 2px; }
.tv-now b { font-size: 20px; }
.tv-now small { color: #d7d9e2; }
/* Farmàcies */
.fa-now { display: grid; gap: 10px; padding: 24px 26px; margin-bottom: 18px; border: 1px solid var(--rule); border-left: 6px solid var(--yel); }
.fa-now h2 { margin: 0; font-size: clamp(26px, 3vw, 38px); line-height: 1.05; letter-spacing: -.035em; }
.fa-addr, .fa-sch { margin: 0; display: flex; gap: 8px; align-items: center; font-size: 17px; font-weight: 600; }
.fa-addr svg.i, .fa-sch svg.i { width: 18px; height: 18px; }
.fa-note { display: flex; gap: 8px; align-items: center; margin: 0 0 24px; font-weight: 600; color: #8a5a00; }
.fa-week { list-style: none; margin: 0 0 10px; padding: 0; }
.fa-week li { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--rule); }
.fa-week time { font-weight: 700; }
.fa-week small { display: block; color: var(--sub); font-size: 13.5px; }
.fa-src { margin: 12px 0 0; color: var(--sub); font-size: 13.5px; }
.fa-src a { text-decoration: underline; }
/* Agenda */
.ag-day { margin: 28px 0 4px; padding-top: 10px; border-top: 1px solid var(--ink); font-size: 20px; font-weight: 800; letter-spacing: -.02em; }
.ag-day:first-child { margin-top: 0; }
.ag-list { list-style: none; margin: 0; padding: 0; }
.ag-list li { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--rule); }
.ag-list time { font-weight: 800; color: var(--navy); font-variant-numeric: tabular-nums; }
.ag-list a { font-weight: 700; font-size: 17px; }
.ag-list a:hover { text-decoration: underline; }
.ag-list small { display: flex; gap: 5px; align-items: center; margin-top: 3px; color: var(--sub); font-size: 13.5px; }
.ag-list small svg.i { width: 14px; height: 14px; }
.pg-news { display: grid; gap: 14px; }
.pg-news .card { grid-template-columns: minmax(0, 1fr) 90px; column-gap: 12px; }
.pg-news .card .ph { grid-column: 2; grid-row: 1 / span 3; aspect-ratio: 1; margin: 0; }
.pg-news .card .h { font-size: 15.5px; }
@media (max-width: 1080px) {
	.pg-grid, .pg-grid:has(.pg-toc), .tv-grid, .ct-grid { grid-template-columns: minmax(0, 1fr); }
	.pg-side, .pg-toc { position: static; max-height: none; }
}
@media (max-width: 720px) {
	.pg-head { padding-block: 14px 18px; margin-bottom: 22px; }
	.pg-head .lead { font-size: 17px; }
	.ct-cards { grid-template-columns: minmax(0, 1fr); }
	.ct-form, .pub-form { padding: 20px; }
	.fa-week li { grid-template-columns: minmax(0, 1fr); gap: 2px; }
	.ag-list li { grid-template-columns: 70px minmax(0, 1fr); }
}
.fa-now.on { border-left-color: #1f9d55; }
.fa-now.on .k { color: #1f7a45; }
.fa-all li { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.fa-st { display: flex; align-items: center; gap: 14px; font-size: 14px; font-weight: 700; }
.fa-st i { font-style: normal; font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--sub); }
.fa-st i.op { color: #1f7a45; }
.fa-st a:hover { text-decoration: underline; }

.fa-week + .fa-src { margin-bottom: 34px; }

/* «Avui a Lloret» desplegat: més aire entre columnes, amb línies fines; el temps a sota de la temperatura */
.avui-panel .avui-grid { column-gap: 36px; grid-template-columns: minmax(0, .75fr) minmax(0, 1.5fr) minmax(0, .95fr) minmax(0, .95fr); }
.avui-panel .avui-grid > * + * { border-left: 1px solid rgba(0, 0, 0, .14); padding-left: 36px; }
.avui-panel .wx { flex-wrap: wrap; }
.avui-panel .wx span { flex-basis: 100%; }
.avui-panel .alist li { grid-template-columns: 66px minmax(0, 1fr); gap: 14px; }
.avui-panel .alist.av li { grid-template-columns: 20px minmax(0, 1fr); }
@media (max-width: 1080px) {
	.avui-panel .avui-grid > * + * { border-left: 0; padding-left: 0; }
	.avui-panel .avui-grid { row-gap: 26px; }
}
@media (max-width: 1080px) { .avui-panel .avui-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .avui-panel .avui-grid { grid-template-columns: minmax(0, 1fr); } }