/* Cordel D' Prata · v2 — Notícias (listagem e artigo) */

  .nav-link.is-current{color:var(--red)}
  .nav-link.is-current::after{transform:scaleX(1)}

  /* ── etiqueta de categoria ── */
  .art-cat{
    font-family:var(--font-nav);font-size:.66rem;font-weight:700;letter-spacing:.09em;
    text-transform:uppercase;color:var(--red);
    padding:.26em .66em;border-radius:999px;background:var(--red-soft);white-space:nowrap;
  }
  .art-cat--imprensa{color:#1F5F53;background:rgba(31,95,83,.09)}
  .art-cat--eventos{color:#8A5A12;background:rgba(138,90,18,.1)}
  .art-cat--premios{color:#6B3E9E;background:rgba(107,62,158,.1)}

  /* ── abertura ── */
  .art-hero{
    background:var(--paper);
    padding-block:calc(var(--header-h,130px) + clamp(28px,3.4vw,50px)) clamp(26px,3vw,42px);
  }
  .art-hero-inner{
    display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
    gap:clamp(24px,4vw,64px);align-items:end;
  }
  .art-hero h1{margin:14px 0 0;font-size:clamp(2.1rem,4.2vw,3.4rem)}
  .art-hero .lead{margin-top:16px;max-width:46ch}
  .art-imprensa{padding-bottom:6px;display:flex;justify-content:flex-end;align-items:flex-end}
  .art-imprensa > span{
    display:block;font-family:var(--font-nav);font-size:.7rem;font-weight:700;
    letter-spacing:.09em;text-transform:uppercase;color:var(--muted);
  }
  .art-imprensa p{
    display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:12px 0 0;
  }
  .art-imprensa b{
    font-family:var(--font-display);font-size:1.02rem;font-weight:600;letter-spacing:-.01em;color:var(--ink-soft);
  }
  .art-imprensa i{color:var(--line-strong);font-style:normal}

  /* ── abertura: o post-it espetado na coluna da imprensa ── */
  .art-imprensa{position:relative}
  .art-postit{position:static;display:inline-block;transform:rotate(4deg)}
  .art-postit:hover{transform:rotate(1deg)}
  @media (max-width:900px){
    /* no ecrã pequeno o post-it fica à direita do título, um nadinha acima
       da linha do eyebrow; o título encolhe à direita para lhe dar espaço */
    .art-hero-inner{position:relative}
    .art-imprensa{position:absolute;top:-14px;right:calc(var(--gutter) + 4px);padding:0;display:block}
    .art-hero-texto h1{padding-right:clamp(120px,34%,160px)}
    .art-postit{position:static;display:inline-block;margin:0;transform:rotate(4deg)}
  }
  @media (max-width:560px){
    /* sem a quebra forçada o título parte-se onde couber, em vez de deixar
       «autores» sozinho numa linha ao lado do post-it */
    .art-hero h1 br{display:none}
  }

  /* ── destaque ── */
  .art-destaque-band{background:var(--paper);padding-bottom:clamp(28px,3.2vw,46px)}
  .art-destaque{
    display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
    gap:clamp(20px,3vw,48px);align-items:center;
    padding:clamp(20px,2.4vw,32px);border-radius:var(--radius-lg);
    background:var(--paper-2);
  }
  /* a fotografia da notícia como uma polaroide presa com fita-cola */
  .art-destaque-foto{
    display:block;justify-self:center;width:min(100%,430px);
    padding:12px 12px 46px;transform:rotate(-2.2deg);
  }
  .art-destaque-foto img{
    display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--paper-3);
  }
  .art-destaque-legenda{
    position:absolute;left:0;right:0;bottom:14px;text-align:center;
    font-family:var(--font-hand);font-size:1.2rem;color:var(--ink);
  }
  .art-destaque:hover .art-destaque-foto{transform:rotate(0) translateY(-6px)}
  .art-destaque-nota{margin:0 0 10px}
  .art-destaque-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
  .art-destaque-meta time{font-size:.8rem;color:var(--muted)}
  .art-destaque h2{
    margin:14px 0 0;font-size:clamp(1.4rem,2.4vw,2.05rem);line-height:1.16;letter-spacing:-.02em;
  }
  .art-destaque:hover h2{color:var(--red)}
  .art-destaque p{margin:14px 0 0;color:var(--ink-soft);max-width:52ch}
  .art-destaque .link-arrow{margin-top:18px}

  /* ── barra de categorias ── */
  .art-band{
    position:sticky;top:var(--menu-h,86px);z-index:20;padding-block:12px;
    background:rgba(250,247,242,.94);
    backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
    border-block:1px solid var(--line);
  }
  .art-filtros{display:flex;align-items:center;gap:14px}
  .art-chips{display:flex;flex-wrap:wrap;gap:3px;flex:1;min-width:0;overflow-y:hidden}
  .art-chip{
    padding:.42em .9em;border-radius:999px;white-space:nowrap;
    font-family:var(--font-nav);font-size:.79rem;font-weight:600;color:var(--ink-soft);
    transition:background .25s ease,color .25s ease;
  }
  .art-chip small{opacity:.6;margin-left:.4em;font-weight:500}
  .art-chip:hover{background:var(--red-soft);color:var(--red)}
  .art-chip.is-on{background:var(--red);color:#fff}
  .art-procura{
    display:flex;align-items:center;gap:9px;flex:0 0 auto;width:min(30%,250px);
    padding:.45em .85em;border-radius:999px;background:#fff;border:1px solid var(--line-strong);
    transition:border-color .3s ease,box-shadow .3s ease;
  }
  .art-procura:focus-within{border-color:var(--red);box-shadow:0 0 0 3px rgba(176,25,31,.12)}
  .art-procura svg{width:16px;height:16px;color:var(--muted);flex:0 0 auto}
  .art-procura input{flex:1;min-width:0;border:0;background:none;font:inherit;font-size:.86rem;color:var(--ink);outline:none}

  /* artigo sem imagem: a caixa fica, para a grelha não desalinhar */
  .art-card-capa--vazia{
    background:
      repeating-linear-gradient(135deg,rgba(176,25,31,.05) 0 12px,transparent 12px 24px),
      linear-gradient(150deg,rgba(176,25,31,.09),rgba(176,25,31,.02));
  }
  .art-grid[aria-busy="true"]{opacity:.5;transition:opacity .3s ease}

  .art-conta{margin:0;flex:0 0 auto;font-size:.82rem;color:var(--muted);white-space:nowrap}
  .art-conta b{color:var(--ink);font-weight:600}

  /* ── grelha ── */
  .art-lista{padding-block:clamp(30px,3.4vw,50px) clamp(48px,6vw,88px)}
  .art-grid{
    --gx:clamp(18px,2.2vw,30px);--mes-h:32px;
    display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(22px,2.6vw,38px) var(--gx);
  }

  /* ── o mês, escrito à mão por cima dos cartões ──
     Não parte a grelha: o nome vai sobre o primeiro cartão do mês, a linha
     atravessa os cartões seguintes (e os intervalos entre eles) e acaba no
     último cartão desse mês. O mês seguinte começa logo no cartão ao lado. */
  .art-card{position:relative}
  .art-card--com-mes{padding-top:calc(var(--mes-h) + 8px)}
  .art-card-mes{
    position:absolute;top:0;left:0;right:calc(-1 * var(--gx));height:var(--mes-h);
    display:flex;align-items:center;gap:14px;pointer-events:none;white-space:nowrap;
    font-family:var(--font-hand);font-weight:400;font-size:clamp(1.1rem,1.3vw,1.3rem);line-height:1;color:var(--red);
  }
  .art-card-mes b{font-weight:400}
  .art-card-mes::after{content:"";flex:1;height:1px;background:var(--line)}
  .art-card-mes.is-fim{right:0}


  /* ── o mês, escrito à mão ──
     Uma pausa na grelha: sem isto são nove cartões iguais em fila. */
  .art-mes{
    grid-column:1/-1;display:flex;align-items:center;gap:16px;
    margin:clamp(6px,1vw,14px) 0 0;font-family:var(--font-hand);font-weight:400;
    font-size:clamp(1.5rem,2.4vw,2rem);line-height:1;color:var(--red);
  }
  .art-mes::after{content:"";flex:1;height:1px;background:var(--line)}
  .art-grid > .art-mes:first-child{margin-top:0}


  /* ── o molde, enquanto as notícias não chegam ── */
  .art-card--molde .art-card-capa,
  .art-molde-linha{
    display:block;border-radius:var(--radius-sm);
    background:linear-gradient(100deg,var(--paper-2) 30%,var(--paper-3) 50%,var(--paper-2) 70%);
    background-size:200% 100%;animation:artMolde 1.4s linear infinite;
  }
  .art-card--molde .art-card-capa{aspect-ratio:16/10}
  .art-molde-linha{height:14px;margin-top:14px}
  .art-molde-linha--curta{width:60%}
  @keyframes artMolde{from{background-position:200% 0}to{background-position:-200% 0}}

  /* ── mais vida ao passar o rato ── */
  /* ao passar o rato levanta-se o conteúdo, não o cartão: a faixa do mês fica no sítio */
  .art-card > :not(.art-card-mes){transition:transform .45s var(--ease)}
  .art-card:hover > :not(.art-card-mes){transform:translateY(-4px)}
  .art-card:hover .art-cat{filter:saturate(1.35)}
  .art-card-capa{position:relative}
  /* um brilho que atravessa a imagem, como quem passa a mão no papel */
  .art-card-capa::after{
    content:"";position:absolute;inset:0;pointer-events:none;opacity:0;
    background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);
    transform:translateX(-60%);
  }
  .art-card:hover .art-card-capa::after{opacity:1;transform:translateX(60%);transition:transform .9s var(--ease),opacity .3s ease}

  .reveal[data-delay="4"]{transition-delay:.32s}
  .reveal[data-delay="5"]{transition-delay:.4s}

  @media (prefers-reduced-motion:reduce){
    .art-card:hover{transform:none}
    .art-card--molde .art-card-capa,.art-molde-linha{animation:none}
    .art-card-capa::after{display:none}
  }
  .art-card{display:flex;flex-direction:column}
  .art-card-capa{
    display:block;overflow:hidden;border-radius:var(--radius-sm);aspect-ratio:16/10;
    background:var(--paper-2);box-shadow:var(--shadow-xs);
  }
  .art-card-capa img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
  .art-card:hover .art-card-capa img{transform:scale(1.04)}
  .art-card-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px}
  .art-card-meta time{font-size:.78rem;color:var(--muted)}
  .art-card h3{
    margin:10px 0 0;font-size:1.06rem;line-height:1.26;letter-spacing:-.015em;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  }
  .art-card:hover h3{color:var(--red)}
  .art-card p{
    margin:8px 0 0;font-size:.88rem;color:var(--muted);line-height:1.5;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  }
  .sem-resultados{margin-top:26px;color:var(--muted);font-size:.96rem}
  .sem-resultados .link-arrow{border:0;background:none;padding:0;cursor:pointer;font:inherit;color:var(--red)}
  .mais-wrap{display:flex;justify-content:center;margin-top:clamp(30px,3.4vw,48px)}

  /* ── artigo ── */
  .art-single-hero{
    background:var(--paper);
    padding-block:calc(var(--header-h,130px) + clamp(24px,3vw,42px)) clamp(24px,2.8vw,38px);
  }
  .art-single-topo{max-width:74ch}
  .art-voltar{
    display:inline-flex;align-items:center;gap:8px;
    font-family:var(--font-nav);font-size:.78rem;font-weight:600;letter-spacing:.03em;
    color:var(--muted);transition:color .25s ease;
  }
  .art-voltar:hover{color:var(--red)}
  .art-voltar svg{width:15px;height:15px}
  .art-single-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:22px}
  .art-single-meta time{font-size:.82rem;color:var(--muted)}
  .art-single-hero h1{
    margin:16px 0 0;font-size:clamp(1.9rem,3.6vw,3rem);line-height:1.1;letter-spacing:-.025em;text-wrap:balance;
  }
  .art-single-hero .lead{margin-top:18px;max-width:60ch;color:var(--ink-soft)}

  /* A imagem da notícia na proporção que tem.
     Antes era cortada a 16:8 e esticada à largura da página: uma capa ao alto
     aparecia como uma fatia gigante e o texto começava um ecrã abaixo. Agora
     a altura é que manda, e a caixa encolhe até ao tamanho da imagem. */
  .art-single-capa{
    margin:0 auto;width:fit-content;max-width:min(100% - var(--gutter) * 2,var(--maxw));
    border-radius:var(--radius-lg);overflow:hidden;background:var(--paper-2);
    box-shadow:var(--shadow-sm);
  }
  .art-single-capa img{
    display:block;width:auto;height:auto;
    max-width:100%;max-height:clamp(300px,46vh,500px);object-fit:contain;
  }

  .art-single-corpo{
    display:grid;grid-template-columns:minmax(0,1fr) 64px;
    gap:clamp(20px,3vw,48px);align-items:start;
    padding-block:clamp(34px,4vw,58px) clamp(40px,5vw,70px);
  }
  .art-corpo{max-width:68ch;margin-inline:auto;grid-column:1}
  /* ligações no texto do artigo: a vermelho e sublinhadas, para se verem no corrido */
  .art-corpo a{color:var(--red);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
  .art-corpo a:hover{color:var(--red-deep,var(--red));text-decoration-thickness:2px}
  .art-corpo p{margin:0 0 1.15em;font-size:1.06rem;line-height:1.72;color:var(--ink-2)}
  .art-corpo p:first-child::first-letter{
    float:left;font-family:var(--font-display);font-size:3.4em;line-height:.82;
    padding:.06em .1em 0 0;color:var(--red);
  }
  .art-partilha{position:sticky;top:calc(var(--menu-h,86px) + 24px);display:grid;gap:10px;justify-items:center}
  .art-partilha > span{
    font-family:var(--font-nav);font-size:.62rem;font-weight:700;letter-spacing:.09em;
    text-transform:uppercase;color:var(--muted);
  }
  .art-partilha > div{display:grid;gap:8px;justify-items:center}
  .art-partilha a,.art-partilha button{
    width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
    border:1px solid var(--line-strong);color:var(--ink-soft);background:transparent;
    transition:background .25s ease,color .25s ease,border-color .25s ease,transform .4s var(--ease);
  }
  .art-partilha a:hover,.art-partilha button:hover{
    background:var(--red);border-color:var(--red);color:#fff;transform:translateY(-2px);
  }
  .art-partilha svg{width:16px;height:16px}
  .art-partilha button.is-ok{background:var(--red);border-color:var(--red);color:#fff}

  .art-relacionados{background:var(--paper-2);border-top:1px solid var(--line);padding-block:clamp(40px,4.6vw,68px)}
  .art-relacionados .fila-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
  .art-relacionados .fila-head h2{margin:0;font-size:clamp(1.5rem,2.5vw,2.1rem);letter-spacing:-.022em}
  .art-relacionados .art-grid{margin-top:clamp(22px,2.6vw,34px)}

  @media (max-width:1000px){
    .art-grid{grid-template-columns:repeat(2,1fr)}
    .art-single-corpo{grid-template-columns:1fr}
    .art-partilha{
      position:static;grid-auto-flow:column;justify-content:start;align-items:center;gap:12px;
      padding-top:8px;border-top:1px solid var(--line);
    }
    .art-partilha > div{grid-auto-flow:column}
  }
  @media (max-width:900px){
    .art-hero-inner{grid-template-columns:1fr;gap:26px;align-items:start}
    .art-destaque{grid-template-columns:1fr;gap:20px}
    .art-single-capa{border-radius:var(--radius-sm)}
    .art-single-capa img{max-height:clamp(240px,38vh,360px)}
  }
  @media (max-width:640px){
    .art-grid{grid-template-columns:1fr;max-width:460px}
    .art-mes{font-size:1.4rem}
    .art-band{position:static}
    .art-filtros{flex-wrap:wrap;gap:10px}
    .art-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;order:3;flex-basis:100%}
    .art-procura{flex:1 1 auto;width:auto}
    .art-chips::-webkit-scrollbar{display:none}
    .art-chip{flex:0 0 auto}
  }
