/* Páginas con contenido que no tenía estilo · Terroir Radical · 13-oct-2026
   Recursos, podcast, tabla de envíos, legales (bloques sueltos), contacto (FAQ), varietats (buscador), fichas (avisos).
   Solo CSS. Paleta: verd #2B5425/#1A3318 · teja #B8451E · groc #F2C012 · rosat #D4607A · paper #FFF8EC.            */

/* ───────── Recursos ───────── */
.recursos-hero { background: #FFF8EC; color: #1A3318; text-align: center; border-bottom: 1px solid rgba(26, 51, 24, .18); padding: clamp(104px, 13svh, 150px) 0 clamp(44px, 6svh, 76px); }
.recursos-hero .eyebrow { display: inline-block; margin: 0 0 22px; padding: 7px 17px 6px; border-radius: 999px; background: #B8451E; color: #FFF8EC; text-transform: none; letter-spacing: .02em; font: 700 1rem/1.15 var(--ff-body); }
.recursos-hero .eyebrow::before { display: none; }
.recursos-hero h1 { margin: 0 auto 18px; max-width: 16ch; color: #1A3318; font: 700 clamp(2.6rem, 6vw, 5rem)/1.04 var(--ff-display); letter-spacing: -.01em; }
.recursos-hero .hl { font-style: italic; background: linear-gradient(transparent 62%, #F7DE86 62% 94%, transparent 94%); padding: 0 .08em; }
.recursos-hero .lead { margin: 0 auto; max-width: 56ch; font-size: clamp(1.05rem, 1.5vw, 1.2rem); line-height: 1.65; color: #1A1710; }

.recursos-section { padding: clamp(44px, 6vw, 80px) 0; background: #fff; }
.recursos-section:nth-of-type(even) { background: #FFF8EC; }
.recursos-section .container { max-width: 1100px; }
.section-header { max-width: 760px; margin: 0 0 clamp(26px, 3.4vw, 42px); }
.section-label { display: inline-block; margin: 0 0 12px; padding: 5px 13px 4px; border-radius: 999px; background: #F2C012; color: #1A3318; font: 700 .9rem/1.15 var(--ff-body); }
.section-header h2 { margin: 0 0 10px; color: #1A3318; font: 700 clamp(1.8rem, 3.2vw, 2.7rem)/1.1 var(--ff-display); }
.section-desc { margin: 0; font-size: 1.05rem; line-height: 1.65; color: #3a3830; }

.webs-grid, .llibres-grid { display: grid; gap: clamp(14px, 1.8vw, 22px); grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.web-card, .llibre-card { display: flex; flex-direction: column; gap: 8px; padding: clamp(18px, 2vw, 26px); background: #fff; border: 1px solid rgba(26, 51, 24, .22); border-radius: 4px; box-shadow: 5px 5px 0 var(--card-sh, #B8451E); transition: transform .18s ease, box-shadow .18s ease; }
.web-card:hover, .llibre-card:hover { transform: translate(-2px, -2px); box-shadow: 8px 8px 0 var(--card-sh, #B8451E); }
.web-card:nth-child(4n+2), .llibre-card:nth-child(4n+2) { --card-sh: #F2C012; }
.web-card:nth-child(4n+3), .llibre-card:nth-child(4n+3) { --card-sh: #2B5425; }
.web-card:nth-child(4n), .llibre-card:nth-child(4n) { --card-sh: #D4607A; }
.web-card-tag, .llibre-tema { font: 700 .88rem/1.3 var(--ff-cond); letter-spacing: .04em; text-transform: uppercase; color: #B8451E; }
.web-card h3, .llibre-card h3 { margin: 0; color: #1A3318; font: 700 1.35rem/1.2 var(--ff-display); }
.web-card p, .llibre-card p { margin: 0; flex: 1; font-size: .98rem; line-height: 1.6; color: #2a281f; }
.web-card a { align-self: flex-start; margin-top: 4px; display: inline-flex; align-items: center; gap: 6px; color: #2B5425; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.web-card a svg { width: 12px; height: 12px; flex: none; }   /* sin esto la flecha ocupaba toda la pantalla */
.autor { font: italic 400 1.05rem/1.3 var(--ff-display); color: #1A3318; }
.autor:empty { display: none; }
.llengua { align-self: flex-start; padding: 2px 9px; border-radius: 999px; border: 1px solid rgba(26, 51, 24, .35); font: 700 .78rem/1.5 var(--ff-cond); letter-spacing: .08em; color: #1A3318; }
.any { font-style: normal; color: rgba(26, 23, 16, .6); }

/* ───────── Podcast y plantilla de convidat ───────── */
.s-plataformes, .s-episodis { padding: clamp(44px, 6vw, 84px) 0; text-align: center; }
.s-plataformes { background: #fff; }
.s-episodis { background: #FFF8EC; }
.s-plataformes .eyebrow, .s-episodis .eyebrow { display: inline-block; margin: 0 0 14px; padding: 5px 13px 4px; border-radius: 999px; background: #D4607A; color: #2A0F18; text-transform: none; letter-spacing: .02em; font: 700 .92rem/1.15 var(--ff-body); }
.s-plataformes .eyebrow::before, .s-episodis .eyebrow::before { display: none; }
.s-plataformes h2, .s-episodis h2 { margin: 0 auto 28px; max-width: 24ch; color: #1A3318; font: 700 clamp(1.7rem, 3vw, 2.5rem)/1.12 var(--ff-display); }
.plataformes-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); max-width: 820px; margin: 0 auto; }
.plataforma-item { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 22px 12px; background: #fff; border: 1px solid rgba(26, 51, 24, .25); border-radius: 4px; text-decoration: none; color: #1A3318; box-shadow: 4px 4px 0 rgba(26, 51, 24, .85); transition: transform .18s, box-shadow .18s; }
.plataforma-item:hover { transform: translate(-2px, -2px); box-shadow: 7px 7px 0 #D4607A; }
.plataforma-icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: #FFF8EC; color: #1A3318; }
.plataforma-icon svg { width: 30px; height: 30px; }
.plataforma-nom { font: 700 1.2rem/1.1 var(--ff-cond); text-transform: uppercase; letter-spacing: .03em; }
.plataforma-estat { font-size: .85rem; color: #B8451E; font-weight: 600; }
.detall { max-width: 56ch; margin: 28px auto 0; font-size: 1rem; line-height: 1.65; color: #3a3830; }
.episodis-buit { max-width: 560px; margin: 18px 0 0; padding: 28px; background: #FFF8EC; border: 2px dashed rgba(26, 51, 24, .35); border-radius: 4px; text-align: center; }
.episodis-buit .titol { margin: 0 0 6px; color: #1A3318; font: 700 1.5rem/1.2 var(--ff-display); }
.episodis-buit .detall { margin: 0 auto; }

/* ───────── Tabla de costes de envío (estaba oscuro sobre oscuro) ───────── */
.s-cta:has(.faq-shipping-table) { background: #FFF8EC; text-align: left; padding-top: 0 !important; }
.s-cta:has(.faq-shipping-table) p { color: #2a281f; margin-left: 0; max-width: 70ch; opacity: 1 !important; }
.s-cta:has(.faq-shipping-table) p[style*="italic"] { color: #4a473d; }
.s-cta:has(.faq-shipping-table) .cta-btn { margin-top: 22px !important; }
.faq-shipping-table { width: 100%; border-collapse: collapse; background: #fff; color: #1A1710; font-size: .98rem; border: 1px solid rgba(26, 51, 24, .22); }
.faq-shipping-table th, .faq-shipping-table td { padding: 11px 14px; text-align: left; border-bottom: 1px solid rgba(26, 51, 24, .14); }
.faq-shipping-table thead th { background: #1A3318; color: #FFF8EC; font: 700 .95rem/1.25 var(--ff-cond); letter-spacing: .04em; text-transform: uppercase; }
.faq-shipping-table tbody th[colspan] { background: #F2E5CB; color: #1A3318; font: 700 1.05rem/1.2 var(--ff-display); }
.faq-shipping-table td:not(:first-child) { white-space: nowrap; }
.faq-shipping-table tbody tr:hover td { background: #FFF8EC; }

/* ───────── Legales: bloques sueltos ───────── */
.provisional-wrap { display: grid; place-items: center; min-height: 60svh; padding: clamp(110px, 14svh, 160px) 24px clamp(60px, 9svh, 110px); background: #FFF8EC; text-align: center; }
.provisional-inner { max-width: 560px; }
.provisional-eyebrow { display: inline-block; margin: 0 0 18px; padding: 6px 15px 5px; border-radius: 999px; background: #E6DECB; color: #1A3318; font: 700 .95rem/1.15 var(--ff-body); }
.provisional-inner h1 { margin: 0; color: #1A3318; font: 700 clamp(2.4rem, 5vw, 3.8rem)/1.05 var(--ff-display); }
.provisional-inner h1 em { font-style: italic; background: linear-gradient(transparent 62%, #F7DE86 62% 94%, transparent 94%); }
.provisional-divider { width: 64px; height: 4px; margin: 24px auto; background: #B8451E; }
.provisional-inner p { margin: 0 0 24px; font-size: 1.1rem; line-height: 1.65; color: #2a281f; }
.provisional-inner .btn { display: inline-block; padding: 14px 30px; background: #2B5425; color: #fff; border-radius: 0; font: 800 .95rem/1 var(--ff-cond); letter-spacing: .08em; text-transform: uppercase; text-decoration: none; transition: background .2s; }
.provisional-inner .btn:hover { background: #1A3318; }
.legal-courtesy { max-width: 760px; margin: 96px auto 0; padding: 12px 18px; border-left: 4px solid #F2C012; background: #FFF8EC; font-size: .95rem; line-height: 1.5; color: #3a3830; }
.legal-courtesy a { color: #2B5425; font-weight: 600; }
.legal-data-box { margin: 18px 0 26px; padding: 18px 22px; background: #FFF8EC; border: 1px solid rgba(26, 51, 24, .25); border-left: 5px solid #B8451E; }
.legal-data-box p { margin: 0 0 8px; }
.legal-data-box p:last-child { margin: 0; }
.drets-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); margin: 18px 0 26px; }
.dret-item { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; background: #FFF8EC; border: 1px solid rgba(26, 51, 24, .22); border-top: 4px solid #B8451E; }
.dret-item strong { color: #1A3318; font: 700 1.1rem/1.2 var(--ff-display); }
.dret-item span { font-size: .95rem; line-height: 1.5; }
.cookie-tag { display: inline-block; padding: 2px 10px; border-radius: 999px; font: 700 .8rem/1.5 var(--ff-cond); letter-spacing: .04em; text-transform: uppercase; background: #E6DECB; color: #1A3318; }
.cookie-tag-essencial { background: #E6EFD0; color: #2B5425; }
.cookie-tag-analitica { background: #F7DE86; color: #5a4300; }
.btn-revocar { margin: 6px 0 18px; padding: 12px 24px; background: #fff; color: #1A3318; border: 2px solid #1A3318; border-radius: 0; font: 800 .92rem/1 var(--ff-cond); letter-spacing: .08em; text-transform: uppercase; cursor: pointer; transition: background .2s, color .2s; }
.btn-revocar:hover { background: #1A3318; color: #fff; }
.nav-llista { margin: 8px 0 18px; padding-left: 1.2em; }
.nav-llista li { margin-bottom: 6px; }
.nav-llista a { color: #2B5425; font-weight: 600; text-underline-offset: 3px; }
.legal-table { width: 100%; border-collapse: collapse; margin: 14px 0 22px; font-size: .96rem; }
.legal-table th, .legal-table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid rgba(26, 51, 24, .18); }
.legal-table th { background: #1A3318; color: #FFF8EC; font: 700 .92rem/1.25 var(--ff-cond); letter-spacing: .04em; text-transform: uppercase; }

/* Fuentes y referencias (territori, artículos) */
.fonts-bloc { margin: clamp(30px, 4vw, 48px) 0 0; padding: 20px 24px; background: #FFF8EC; border-left: 5px solid #2B5425; font-size: .95rem; line-height: 1.6; color: #2a281f; }
.fonts-bloc h4 { margin: 0 0 10px; color: #1A3318; font: 700 1.15rem/1.2 var(--ff-display); }
.fonts-bloc ul { margin: 0; padding-left: 1.2em; }
.fonts-bloc li { margin-bottom: 6px; }
.fonts-bloc a { color: #2B5425; text-underline-offset: 3px; }

/* ───────── Contacto: preguntas frecuentes y avisos del formulario ───────── */
.s-faq { padding: clamp(44px, 6vw, 80px) 0; background: #FFF8EC; }
.s-faq .container { max-width: 760px; }
.s-faq .eyebrow { display: inline-block; margin: 0 0 18px; padding: 5px 13px 4px; border-radius: 999px; background: #B8451E; color: #FFF8EC; text-transform: none; letter-spacing: .02em; font: 700 .92rem/1.15 var(--ff-body); }
.s-faq .eyebrow::before { display: none; }
.s-faq .faq-llista { border-top: 1px solid rgba(26, 51, 24, .3); }
.s-faq .faq-item { border-bottom: 1px solid rgba(26, 51, 24, .3); }
.s-faq .faq-pregunta { display: flex; width: 100%; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 0; background: none; border: 0; text-align: left; cursor: pointer; color: #1A3318; font: 700 1.2rem/1.3 var(--ff-display); }
.s-faq .faq-pregunta:hover { color: #B8451E; }
.s-faq .faq-icona { position: relative; flex: none; width: 18px; height: 18px; }
.s-faq .faq-icona::before, .s-faq .faq-icona::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 2px; background: currentColor; transition: transform .2s; }
.s-faq .faq-icona::after { transform: rotate(90deg); }
.s-faq .faq-pregunta[aria-expanded="true"] .faq-icona::after, .s-faq .faq-item.obert .faq-icona::after { transform: rotate(0); }
.s-faq .faq-resposta { padding: 0 0 18px; font-size: 1.02rem; line-height: 1.65; color: #2a281f; }
.s-faq .faq-resposta p { margin: 0; }
.form-feedback { display: none; margin: 0 0 18px; padding: 14px 18px; font-size: .98rem; line-height: 1.5; border-left: 5px solid; }
.form-feedback--ok { background: #E6EFD0; color: #1A3318; border-color: #2B5425; }
.form-feedback--error { background: #FBE0D6; color: #6b1d0a; border-color: #B8451E; }
.form-feedback.visible, .form-feedback[style*="block"], .form-feedback[style*="flex"] { display: block; }

/* ───────── Varietats: buscador y enlace "ficha completa" ───────── */
.filtre-cerca-wrap { position: relative; }
.filtre-cerca-icon { position: absolute; left: 14px; top: 50%; transform: translateY(-52%); font-size: 1.2rem; color: #2B5425; pointer-events: none; }
.filtre-cerca { width: 100%; padding: 12px 14px 12px 42px; background: #fff; border: 2px solid #1A3318; border-radius: 0; font: 500 1rem/1.3 var(--ff-body); color: #1A1710; }
.filtre-cerca:focus { outline: 3px solid #F2C012; outline-offset: 1px; }
.filtre-reset { padding: 9px 18px; background: transparent; border: 1.5px solid #1A3318; color: #1A3318; border-radius: 0; font: 700 .9rem/1 var(--ff-cond); letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.filtre-reset:hover { background: #1A3318; color: #fff; }
.note-more { display: inline-block; margin-top: 6px; color: #2B5425; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.note-more:hover { color: #B8451E; }

/* ───────── Portada ───────── */
.filtre-eyebrow { margin: 0 0 8px; text-align: center; color: #B8451E; font: 700 1rem/1.2 var(--ff-body); }
.ruta-promo { color: #F2C012 !important; font-weight: 700; }
.destacat-text { display: flex; flex-direction: column; gap: 6px; }
.vi-card-nou--soon { opacity: .75; }

/* ───────── Productores / territorios ───────── */
.trm-intro { max-width: 62ch; margin: 0 0 clamp(24px, 3vw, 36px); }
.trm-intro h2 { margin: 0 0 10px; color: #1A3318; font: 700 clamp(1.7rem, 3vw, 2.4rem)/1.12 var(--ff-display); }
.trm-intro p { margin: 0; font-size: 1.05rem; line-height: 1.65; }
.trm-back { margin: clamp(22px, 3vw, 34px) 0 0; }
.trm-back a { color: #2B5425; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.trm-back a:hover { color: #B8451E; }
.vins-banner { padding: 14px 18px; background: #FFF8EC; border-left: 5px solid #B8451E; font: 700 1.1rem/1.5 var(--ff-cond); letter-spacing: .02em; color: #1A3318; }
.dada-banner-inline { margin: 0 0 clamp(22px, 3vw, 34px); padding: 20px 24px; background: #FFF8EC; border-left: 6px solid #F2C012; font-size: 1.08rem; line-height: 1.65; color: #1A1710; }
.dada-banner-inline .dada-label { display: block; margin-bottom: 6px; color: #B8451E; font: 800 .95rem/1.2 var(--ff-cond); letter-spacing: .04em; }
.tag { display: inline-block; padding: 4px 12px; border-radius: 999px; border: 1px solid currentColor; font: 700 .85rem/1.4 var(--ff-cond); letter-spacing: .04em; text-transform: uppercase; }
.article-cover { margin: 0 auto; max-width: 1100px; padding: 0 24px; }
.article-cover img { display: block; width: 100%; height: auto; max-height: 520px; object-fit: cover; }
h3.s-vors { margin: 26px 0 8px; color: #1A3318; font: 700 1.4rem/1.25 var(--ff-display); }

/* ───────── Catálogo y fichas de vino ───────── */
.vi-nom-link { color: inherit; text-decoration: none; }
.vi-nom-link:hover { color: #B8451E; }
.cat-aviso { max-width: 1100px; margin: 12px auto; padding: 12px 18px; background: #FFF8EC; border-left: 5px solid #F2C012; font-size: .98rem; line-height: 1.5; color: #2a281f; }
.cat-aviso a { color: #2B5425; font-weight: 700; text-underline-offset: 3px; }
.vi-promo-tag { align-self: center; width: fit-content; max-width: calc(100% - 28px); margin: 8px auto; padding: 3px 12px; display: block; text-align: center; background: #F2C012; color: #1A3318; border-radius: 999px; font: 700 .78rem/1.5 var(--ff-cond); letter-spacing: .05em; text-transform: uppercase; }
.vi-oferta { margin: 8px 14px; padding: 10px 12px; background: #FDF1C8; border-left: 4px solid #F2C012; font-size: .9rem; line-height: 1.45; color: #1A3318; }
.vi-sulfits-txt { font-weight: 700; letter-spacing: .02em; }
.vi-agotado-alt { margin: 16px 14px; padding: 14px 16px; background: #F4EFE3; border-left: 4px solid #B8451E; font-size: .95rem; line-height: 1.55; color: #2a281f; }
.vi-agotado-alt p { margin: 0 0 6px; }
.vi-agotado-alt a { color: #2B5425; font-weight: 700; }
.vi-ficha-btn--disabled { opacity: .45; pointer-events: none; cursor: default; }
.vi-larural-info { max-width: 760px; margin: clamp(30px, 4vw, 48px) auto; padding: 0 24px; font-size: 1.05rem; line-height: 1.7; color: #1A1710; }
.vi-larural-info h2 { margin: 0 0 12px; color: #1A3318; font: 700 1.7rem/1.15 var(--ff-display); }
.vv-card--esgotat { opacity: .55; }
.vv-card--esgotat .vv-card-preu { text-decoration: line-through; }

/* Móvil */
@media (max-width: 640px) {
  .recursos-hero h1 { max-width: none; }
  .faq-shipping-table th, .faq-shipping-table td { padding: 9px 10px; font-size: .9rem; }
}