/* Cordel D' Prata · v2 — página Livraria */

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

  /* ── abertura: saudação + atalhos ── */
  .loja-hero{
    background:var(--paper);
    padding-block:calc(var(--header-h,130px) + clamp(30px,3.6vw,54px)) 0;
  }
  /* fotografia da casa por trás da abertura — presença, não decoração */
  .band-photo--livraria{--band-photo:url('/img/faixas/faixa-livraria.jpg')}
  .band-photo--livraria::before{
    /* alinhada com as outras faixas; a máscara desta já a esbate por cima,
       por isso a 20% fica ainda mais discreta do que nas restantes */
    opacity:.20;
    /* alinhada ao topo: interessam as estantes e a camisola 'Made in
       Cordel', não as pernas — a foto já vem cortada em cima para a
       camisola cair no terço superior, antes de a máscara a apagar */
    background-position:center top;
    -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.85),transparent 72%);
    mask-image:linear-gradient(180deg,rgba(0,0,0,.85),transparent 72%);
  }
  .loja-hero > *{position:relative;z-index:1}
  .loja-hero-linha{display:flex;align-items:flex-end;justify-content:space-between;gap:clamp(24px,4vw,64px)}
  .loja-saudacao{
    margin:0;max-width:20ch;
    font-size:clamp(2.3rem,4.6vw,3.8rem);line-height:1.06;letter-spacing:-.028em;
    color:var(--muted);text-wrap:balance;
  }
  .loja-saudacao b{color:var(--ink);font-weight:inherit}
  .loja-ajuda{
    flex:0 0 auto;display:grid;justify-items:end;gap:3px;text-align:right;padding-bottom:6px;
  }
  .loja-ajuda span{font-size:.84rem;color:var(--muted)}
  .loja-ajuda a{
    font-size:.92rem;font-weight:500;color:var(--red);
    border-bottom:1px solid rgba(176,25,31,.26);transition:border-color .25s ease;
  }
  .loja-ajuda a:hover{border-bottom-color:var(--red)}

  /* a fila alinha com o wrap, mas continua a poder correr até à margem */
  .loja-rail-wrap{
    margin-top:clamp(28px,3.2vw,46px);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;
    -webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;
    scroll-padding-inline:max(var(--gutter),(100vw - var(--maxw))/2 + var(--gutter));
  }
  .loja-rail-wrap::-webkit-scrollbar{display:none}
  .loja-rail{
    display:flex;gap:clamp(18px,2.6vw,40px);width:max-content;min-width:100%;
    padding-inline:max(var(--gutter),(100vw - var(--maxw))/2 + var(--gutter));
    padding-block:8px clamp(28px,3.2vw,44px);
  }
  .loja-atalho{
    flex:0 0 auto;display:grid;justify-items:center;gap:11px;scroll-snap-align:start;
    appearance:none;-webkit-appearance:none;background:none;border:0;padding:0;cursor:pointer;
    font-family:var(--font-nav);font-size:.79rem;font-weight:600;color:var(--ink-soft);
    transition:color .3s ease;
  }
  .loja-disco{
    width:clamp(62px,5.8vw,76px);aspect-ratio:1;border-radius:50%;
    display:grid;place-items:center;
    background:radial-gradient(circle at 32% 26%,#fff,var(--paper-2) 78%);
    border:1px solid var(--line);color:var(--red);
    box-shadow:var(--shadow-xs);
    transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .3s ease;
  }
  .loja-disco svg{width:40%;height:40%}
  .loja-atalho:hover{color:var(--red)}
  .loja-atalho:hover .loja-disco{
    transform:translateY(-5px);border-color:rgba(176,25,31,.32);
    box-shadow:0 20px 34px -20px rgba(22,18,15,.5);
  }

  /* ── cartões de novidades ── */
  .loja-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
  .loja-head h2{margin:0;font-size:clamp(1.6rem,2.8vw,2.3rem);letter-spacing:-.022em}
  .loja-head p{margin:5px 0 0;font-size:.9rem;color:var(--muted)}
  .loja-cards{
    display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,26px);
    margin-top:clamp(20px,2.4vw,32px);
  }
  .loja-card{
    position:relative;overflow:hidden;display:flex;flex-direction:column;
    padding:clamp(24px,2.6vw,38px) clamp(20px,2.2vw,32px) clamp(20px,2.2vw,30px);
    border-radius:var(--radius-lg);background:var(--paper-2);
    transition:transform .55s var(--ease),box-shadow .55s var(--ease);
  }
  .loja-card::before{
    content:"";position:absolute;inset:0;opacity:.5;
    background-image:radial-gradient(circle at 1px 1px,rgba(22,18,15,.16) 1px,transparent 0);
    background-size:22px 22px;
    -webkit-mask-image:linear-gradient(180deg,#000,transparent 62%);
    mask-image:linear-gradient(180deg,#000,transparent 62%);
  }
  .loja-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
  .loja-card--destaque{background:linear-gradient(158deg,var(--red-deep),var(--red) 62%,#C92026);color:#fff}
  .loja-card--destaque::before{background-image:radial-gradient(circle at 1px 1px,rgba(255,255,255,.5) 1px,transparent 0)}
  .loja-card-etiqueta{
    position:relative;z-index:1;align-self:flex-start;
    font-family:var(--font-nav);font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
    color:var(--red);
  }
  .loja-card--destaque .loja-card-etiqueta{color:rgba(255,255,255,.82)}
  .loja-card-capa{
    position:relative;z-index:1;margin:clamp(20px,2.2vw,30px) 0 0;
    display:flex;align-items:center;justify-content:center;
    height:clamp(180px,17vw,230px);
  }
  .loja-card-capa img{
    width:auto;height:100%;max-width:100%;object-fit:contain;border-radius:4px;
    box-shadow:0 26px 40px -22px rgba(22,18,15,.62),0 3px 8px rgba(22,18,15,.16);
    transform:rotate(-2deg);transition:transform .6s var(--ease);
  }
  .loja-card:hover .loja-card-capa img{transform:rotate(-2deg) translateY(-8px)}
  .loja-card-info{position:relative;z-index:1;margin-top:clamp(20px,2.2vw,28px)}
  .loja-card-info h3{margin:0;font-size:clamp(1.08rem,1.5vw,1.3rem);line-height:1.2;letter-spacing:-.015em}
  .loja-card-info p{margin:6px 0 0;font-size:.86rem;color:var(--muted)}
  .loja-card--destaque .loja-card-info p{color:rgba(255,255,255,.76)}
  .loja-card-fundo{
    position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;
    gap:14px;margin-top:auto;padding-top:16px;
  }
  .loja-card-preco{font-family:var(--font-display);font-weight:600;font-size:1.2rem;color:var(--red)}
  .loja-card--destaque .loja-card-preco{color:#fff}
  .loja-card .btn{padding:.62em 1.3em;font-size:.74rem}
  .loja-card-nota{
    position:absolute;z-index:2;top:clamp(16px,1.8vw,24px);right:clamp(14px,1.8vw,26px);
    font-family:var(--font-hand);font-size:1.1rem;line-height:1.1;text-align:right;
    color:var(--red);transform:rotate(3deg);max-width:9ch;
  }
  .loja-card--destaque .loja-card-nota{color:rgba(255,255,255,.9)}

  .loja-atalho.is-on{color:var(--red)}
  .loja-atalho.is-on .loja-disco{border-color:rgba(176,25,31,.4);background:radial-gradient(circle at 32% 26%,#fff,#F6E7E4 82%)}
  .loja-cara{
    width:38px;height:38px;border-radius:50%;overflow:hidden;margin-bottom:8px;
    background:var(--paper-3);box-shadow:var(--shadow-xs);
  }
  .loja-cara img{width:100%;height:100%;object-fit:cover;object-position:top center}
  .loja-tranquilo-grid small a{color:var(--red);border-bottom:1px solid rgba(176,25,31,.26)}

  /* ── filas de descoberta ── */
  .descobrir{background:var(--paper);padding-bottom:clamp(40px,5vw,72px)}
  .descobrir > .wrap + .wrap{margin-top:clamp(40px,4.6vw,68px)}
  .fila{margin-top:clamp(38px,4.4vw,64px)}
  .fila:first-child{margin-top:0}
  .fila-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
  .fila-head h2{margin:0;font-size:clamp(1.5rem,2.5vw,2.1rem);letter-spacing:-.022em}
  .fila-head p{margin:5px 0 0;font-size:.9rem;color:var(--muted)}
  .fila-tools{display:flex;align-items:center;gap:clamp(14px,1.8vw,24px);flex:0 0 auto}
  /* só desliza na horizontal; a folga em cima e em baixo é para as sombras
     e para a capa subir no hover sem cortar nem criar barra vertical      */
  .fila-scroll{
    display:flex;gap:clamp(16px,1.8vw,26px);
    overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:none;
    margin-top:clamp(10px,1.2vw,16px);padding-block:14px 10px;
  }
  .fila-scroll::-webkit-scrollbar{display:none}
  .fila-scroll .book{flex:0 0 clamp(136px,14vw,168px);scroll-snap-align:start}

  /* a fila de novidades ganha fundo próprio, é a montra da casa */
  .fila--destaque{
    position:relative;padding:clamp(26px,3vw,42px) clamp(20px,2.4vw,36px);
    border-radius:var(--radius-lg);background:var(--paper-2);overflow:hidden;
  }
  .fila--destaque::before{
    content:"";position:absolute;inset:0;opacity:.5;
    background-image:radial-gradient(circle at 1px 1px,rgba(22,18,15,.16) 1px,transparent 0);
    background-size:22px 22px;
    -webkit-mask-image:linear-gradient(180deg,#000,transparent 70%);
    mask-image:linear-gradient(180deg,#000,transparent 70%);
  }
  .fila--destaque > *{position:relative;z-index:1}
  .fila--destaque .fila-scroll{--sangra:clamp(20px,2.4vw,36px)}

  .descobrir-fim{
    display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;
    margin-top:clamp(40px,4.6vw,68px);padding-top:clamp(28px,3vw,44px);border-top:1px solid var(--line);
  }
  .descobrir-fim p{margin:0;font-size:.92rem;color:var(--muted)}

  /* ── tranquilidade ── */
  .loja-tranquilo{padding-block:clamp(26px,3vw,44px);border-block:1px solid var(--line);background:var(--paper)}
  .loja-tranquilo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,40px)}
  .loja-tranquilo-grid > div{display:grid;gap:4px;align-content:start}
  .loja-icone{
    width:34px;height:34px;border-radius:50%;display:grid;place-items:center;margin-bottom:8px;
    background:var(--red-soft);color:var(--red);
  }
  .loja-icone svg{width:17px;height:17px}
  .loja-tranquilo-grid b{font-size:.94rem;font-weight:600}
  .loja-tranquilo-grid small{font-size:.84rem;color:var(--muted);line-height:1.45}

  /* voltar ao modo montra */
  .liv-voltar{
    display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;
    font-family:var(--font-nav);font-size:.82rem;font-weight:600;color:var(--ink-soft);
    padding-right:clamp(6px,1vw,14px);margin-right:clamp(2px,.6vw,8px);
    border-right:1px solid var(--line);transition:color .25s ease;
  }
  .liv-voltar:hover{color:var(--red)}
  .liv-voltar svg{width:15px;height:15px}

  /* ── barra ── */
  .liv-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-bottom:1px solid var(--line);
  }
  .liv-barra{display:flex;align-items:center;gap:clamp(10px,1.4vw,18px)}
  /* procura e ordenar ficam juntas, encostadas à direita */
  .liv-campo{
    display:flex;align-items:center;gap:10px;flex:0 0 auto;width:min(34%,300px);margin-left:auto;
    padding:.5em .9em;border-radius:999px;background:#fff;border:1px solid var(--line-strong);
    transition:border-color .3s ease,box-shadow .3s ease;
  }
  .liv-campo:focus-within{border-color:var(--red);box-shadow:0 0 0 3px rgba(176,25,31,.12)}
  .liv-campo svg{width:17px;height:17px;color:var(--muted);flex:0 0 auto}
  .liv-campo input{flex:1;min-width:0;border:0;background:none;font:inherit;font-size:.9rem;color:var(--ink);outline:none}

  /* subcategorias (Livro Prático, Biografia…) debaixo da mãe */
  .liv-opcao--filha{padding-left:22px;font-size:.94em}

  .liv-btn-filtros{
    display:none;align-items:center;gap:8px;flex:0 0 auto;
    padding:.46em 1em;border-radius:999px;border:1px solid var(--line-strong);background:#fff;
    font-family:var(--font-nav);font-size:.82rem;font-weight:600;
  }
  .liv-btn-filtros svg{width:16px;height:16px}
  .liv-btn-filtros b{
    min-width:19px;height:19px;border-radius:999px;background:var(--red);color:#fff;
    font-size:.68rem;display:grid;place-items:center;
  }
  .liv-ordem{display:flex;align-items:center;gap:8px;flex:0 0 auto}
  .liv-ordem label{font-size:.8rem;color:var(--muted);white-space:nowrap}
  .liv-ordem select{
    font:inherit;font-size:.84rem;color:var(--ink);cursor:pointer;
    padding:.42em 2em .42em .8em;border-radius:999px;border:1px solid var(--line-strong);background:#fff;
    appearance:none;-webkit-appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237C716A' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right .7em center;background-size:13px;
  }
  .liv-ordem select:focus-visible{border-color:var(--red)}

  /* ── coluna de filtros ── */
  .liv-lista{padding-block:clamp(26px,3vw,42px) clamp(48px,6vw,88px)}
  .liv-layout{display:grid;grid-template-columns:clamp(190px,17vw,232px) minmax(0,1fr);gap:clamp(26px,3.2vw,52px);align-items:start}
  .liv-fundo{display:none}
  .liv-painel{position:sticky;top:calc(var(--menu-h,86px) + 80px)}
  .liv-painel-topo,.liv-painel-fundo{display:none}
  .liv-rail{display:grid;gap:clamp(20px,2.2vw,30px)}
  .liv-grupo{border:0;margin:0;padding:0}
  .liv-grupo legend{
    padding:0 0 10px;width:100%;border-bottom:1px solid var(--line);margin-bottom:10px;
    font-family:var(--font-nav);font-size:.72rem;font-weight:700;letter-spacing:.09em;
    text-transform:uppercase;color:var(--muted);
  }
  .liv-opcao{
    display:flex;align-items:center;gap:9px;padding:.34em 0;cursor:pointer;
    font-size:.88rem;color:var(--ink-soft);transition:color .2s ease;
  }
  .liv-opcao:hover{color:var(--ink)}
  .liv-opcao input{position:absolute;opacity:0;width:0;height:0}
  .liv-marca{
    flex:0 0 auto;width:16px;height:16px;border-radius:4px;
    border:1.5px solid var(--line-strong);background:#fff;
    transition:background .2s ease,border-color .2s ease;position:relative;
  }
  .liv-marca::after{
    content:"";position:absolute;inset:0;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 13l4 4L19 7'/%3E%3C/svg%3E") center/11px no-repeat;
    opacity:0;transition:opacity .2s ease;
  }
  .liv-opcao input:checked + .liv-marca{background:var(--red);border-color:var(--red)}
  .liv-opcao input:checked + .liv-marca::after{opacity:1}
  .liv-opcao input:focus-visible + .liv-marca{outline:2px solid var(--red);outline-offset:2px}
  .liv-opcao-nome{flex:1;min-width:0}
  .liv-opcao-n{font-size:.76rem;color:var(--muted);font-variant-numeric:tabular-nums}
  .liv-opcao.is-vazia{opacity:.38;cursor:default}

  /* ── topo do conteúdo: contagem + filtros activos ── */
  .liv-topo{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-bottom:clamp(16px,1.8vw,24px)}
  .liv-conta{margin:0;font-size:.84rem;color:var(--muted)}
  .liv-conta b{color:var(--ink);font-weight:600}
  .liv-pills{display:flex;flex-wrap:wrap;gap:6px}
  .liv-pill{
    display:inline-flex;align-items:center;gap:7px;
    padding:.3em .75em;border-radius:999px;border:1px solid var(--line-strong);background:#fff;
    font-size:.78rem;color:var(--ink-soft);transition:border-color .25s ease,color .25s ease;
  }
  .liv-pill span{font-size:.7rem;color:var(--muted)}
  .liv-pill:hover{border-color:var(--red);color:var(--red)}
  .liv-pill:hover span{color:var(--red)}
  .liv-limpar{font-size:.78rem;color:var(--red);font-weight:600;text-decoration:underline;text-underline-offset:3px}
  .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

  /* ── grelha: capas na proporção real, assentes na mesma linha ── */
  /* Uma capa nunca se deforma nem se corta. Todas têm a mesma altura, e cada
     livro fica com a largura que a sua capa pede: a quadrada da Meialonga é
     mais larga do que um romance ao alto. Por isso a grelha não tem colunas
     iguais — os livros arrumam-se lado a lado, como numa estante.          */
  .liv-book{--liv-capa-h:clamp(186px,20vw,254px)}
  .grelha-livros{
    display:flex;flex-wrap:wrap;align-items:flex-start;
    gap:clamp(24px,2.6vw,38px) clamp(14px,1.8vw,24px);
  }
  .grelha-livros .book,.fila-scroll .liv-book{flex:0 0 auto;width:min-content}
  .liv-book .book-cover{
    aspect-ratio:auto;height:var(--liv-capa-h);
    /* enquanto a imagem não chega, guarda o lugar de um livro ao alto */
    min-width:calc(var(--liv-capa-h) * .62);
    display:flex;align-items:flex-end;justify-content:center;
    background:none;box-shadow:none;border-radius:0;overflow:visible;transform:none;
  }
  .liv-book .book-cover::after{display:none}
  /* a altura manda e a largura sai da proporção da capa: sem object-fit nem
     limites de largura, o elemento tem o tamanho exacto da capa (e a sombra
     também) */
  .liv-book .book-cover img{
    width:auto;height:100%;max-width:none;flex:0 0 auto;
    border-radius:3px;box-shadow:var(--shadow-book);
    transition:transform .55s var(--ease),box-shadow .55s var(--ease);
  }
  .liv-book:hover .book-cover{transform:none;box-shadow:none}
  .liv-book:hover .book-cover img{
    transform:translateY(-8px) rotate(-1.2deg);box-shadow:0 30px 46px -22px rgba(22,18,15,.55);
  }
  .book-etiqueta{
    justify-self:start;margin-bottom:5px;padding:.2em .6em;border-radius:999px;
    background:var(--red);color:#fff;
    font-family:var(--font-nav);font-size:.62rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  }
  .book-etiqueta--soon{background:var(--ink)}
  .book-etiqueta.etiqueta--promo{background:var(--ouro,#B8860B);color:#1a1207}
  .loja-card-preco.preco--promo s{font-family:var(--font-body,inherit);font-size:.7em}
  .loja-card--destaque .loja-card-preco.preco--promo s{color:rgba(255,255,255,.7)}
  .book-comprar{
    position:absolute;left:50%;bottom:8px;transform:translate(-50%,8px);z-index:2;
    display:flex;align-items:center;justify-content:center;gap:.4em;
    padding:.55em 1em;border-radius:999px;background:var(--red);color:#fff;
    font-family:var(--font-nav);font-size:.72rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
    opacity:0;transition:opacity .35s ease,transform .45s var(--ease);white-space:nowrap;
  }
  .book:hover .book-comprar,.book:focus-within .book-comprar{opacity:1;transform:translate(-50%,0)}
  .book-comprar svg{width:13px;height:13px}
  @media (hover:none){.book-comprar{display:none}}

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

  /* ── quem anda a ler ── */
  .fila--vozes .fila-scroll{padding-block:16px 12px}
  .rec{
    flex:0 0 clamp(210px,20vw,246px);scroll-snap-align:start;
    display:flex;flex-direction:column;
    padding:clamp(14px,1.4vw,18px);border-radius:var(--radius-sm);
    background:var(--card);box-shadow:var(--shadow-xs);
    transition:transform .5s var(--ease),box-shadow .5s var(--ease);
  }
  .rec:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm)}
  .rec-capa{
    position:relative;display:flex;align-items:center;justify-content:center;
    height:clamp(112px,11vw,132px);
  }
  .rec-capa > img:first-child{
    width:auto;height:100%;max-width:100%;object-fit:contain;border-radius:3px;
    box-shadow:var(--shadow-book);
  }
  .rec-cara{
    position:absolute;left:0;bottom:-14px;
    width:clamp(58px,5.4vw,70px);aspect-ratio:1;border-radius:50%;object-fit:cover;object-position:top center;
    border:3px solid var(--card);background:var(--paper-3);box-shadow:var(--shadow-sm);
  }
  .rec-cara--letra{
    display:grid;place-items:center;background:var(--red);color:#fff;
    font-family:var(--font-display);font-size:1.5rem;font-weight:600;
  }
  .rec q{
    display:block;margin:26px 0 0;quotes:none;
    font-family:var(--font-hand);font-size:1.1rem;line-height:1.24;color:var(--ink);
  }
  .rec-quem{
    display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 7px;margin:12px 0 0;
  }
  .rec-quem b{font-size:.86rem;font-weight:600}
  .rec-quem small{font-size:.76rem;color:var(--muted);flex-basis:100%}
  .rec-casa{
    font-family:var(--font-nav);font-size:.6rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
    color:var(--red);background:var(--red-soft);padding:.18em .5em;border-radius:999px;
  }
  .rec-livro{
    display:flex;align-items:baseline;justify-content:space-between;gap:10px;
    margin:auto 0 0;padding-top:12px;font-size:.8rem;line-height:1.3;
  }
  .rec-livro b{font-weight:600;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
  .rec-livro span{color:var(--red);font-weight:600;flex:0 0 auto}
  .rec:hover .rec-livro b{color:var(--red)}
  .rec-post{
    display:inline-flex;align-items:center;gap:6px;margin:auto 0 0;padding-top:12px;
    border-top:1px solid var(--line);
    font-size:.76rem;color:var(--muted);transition:color .25s ease;
  }
  .rec-post svg{width:13px;height:13px}
  .rec-post:hover{color:var(--red)}

  .ct-asterisco{
    color:var(--red);font-weight:700;margin-left:1px;vertical-align:super;font-size:.72em;
  }
  .liv-notas{padding-block:clamp(22px,2.4vw,34px);background:var(--paper);border-top:1px solid var(--line)}
  .liv-notas p{margin:0;max-width:92ch;font-size:.82rem;line-height:1.65;color:var(--muted)}
  .liv-notas b{color:var(--ink-soft);font-weight:600}
  .liv-notas a{color:var(--red);border-bottom:1px solid rgba(176,25,31,.26)}

  /* ── escolhas da equipa: uma faixa fina, não um capítulo ── */
  .escolhas{
    background:var(--paper-2);border-block:1px solid var(--line);
    padding-block:clamp(26px,3vw,44px);margin-top:clamp(34px,4vw,58px);
  }
  .escolhas-head{max-width:56ch}
  .escolhas-head h2{margin:12px 0 0}
  .escolhas-head p{margin:14px 0 0;color:var(--ink-soft)}
  .escolhas-grid{
    display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,24px);
    margin-top:clamp(16px,1.8vw,24px);
  }
  .escolha{
    display:grid;grid-template-columns:clamp(64px,6.4vw,84px) minmax(0,1fr);
    gap:clamp(12px,1.4vw,18px);align-items:center;
    padding:clamp(12px,1.4vw,18px);border-radius:var(--radius-sm);
    background:var(--card);box-shadow:var(--shadow-xs);
  }
  .escolha-capa{margin:0}
  .escolha-capa{display:flex;align-items:center;justify-content:center;height:clamp(92px,9.4vw,116px)}
  .escolha-capa img{
    width:auto;height:100%;max-width:100%;object-fit:contain;border-radius:4px;
    box-shadow:var(--shadow-book);
  }
  .escolha-quem{display:flex;align-items:center;gap:9px}
  .escolha-quem img{
    width:28px;height:28px;border-radius:50%;object-fit:cover;object-position:top center;
    background:var(--paper-3);
  }
  .escolha-quem b{font-size:.84rem;font-weight:600;display:block;line-height:1.2}
  .escolha-quem small{font-size:.72rem;color:var(--muted)}
  .escolha q{
    display:block;margin-top:8px;font-family:var(--font-hand);font-size:1.06rem;line-height:1.24;
    color:var(--ink);quotes:none;
  }
  .escolha-livro{margin-top:8px;display:block;font-size:.8rem;line-height:1.32}
  .escolha-livro b{display:block;font-weight:600}
  .escolha-livro span{color:var(--muted)}
  .escolha:hover .escolha-livro b{color:var(--red)}

  /* ── chancelas ── */
  .liv-chancelas{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.8vw,26px);margin-top:clamp(30px,3.4vw,46px)}
  .liv-chancela{
    display:grid;align-content:start;gap:6px;padding:clamp(16px,1.8vw,24px);
    border:1px solid var(--line);border-radius:var(--radius-sm);
    transition:border-color .3s ease,background .3s ease,transform .5s var(--ease);
  }
  .liv-chancela:hover{border-color:var(--red);background:var(--red-soft);transform:translateY(-3px)}
  .liv-chancela b{font-family:var(--font-display);font-size:1.05rem;font-weight:600;letter-spacing:-.01em}
  .liv-chancela small{font-size:.82rem;color:var(--muted);line-height:1.45}

  /* ── à espera da API ──
     O lugar de cada capa fica ocupado enquanto a resposta não chega: a
     página não salta por baixo do rato de quem já estava a clicar. */
  .book--vazio{pointer-events:none}
  .book--vazio .book-cover{
    width:100%;border-radius:3px;
    background:linear-gradient(100deg,var(--paper-2) 30%,rgba(255,255,255,.72) 50%,var(--paper-2) 70%);
    background-size:220% 100%;animation:livBrilho 1.5s linear infinite;
  }
  .book--vazio .book-meta i{
    display:block;height:9px;border-radius:4px;background:var(--paper-2);margin-top:9px;
  }
  .book--vazio .book-meta i:last-child{width:56%}
  @keyframes livBrilho{from{background-position:220% 0}to{background-position:-220% 0}}
  @media (prefers-reduced-motion:reduce){
    .book--vazio .book-cover{animation:none}
  }

  /* raro, mas acontece: livro sem capa carregada no backoffice */
  .book-semcapa{
    display:grid;place-items:center;height:100%;aspect-ratio:2/3;
    border-radius:3px;background:var(--paper-2);box-shadow:var(--shadow-book);
    font-family:var(--font-display);font-size:2.2rem;color:var(--muted);
  }

  .grelha-livros[aria-busy="true"]{opacity:.55;transition:opacity .2s ease}

  @media (max-width:1000px){
    .escolhas-grid{grid-template-columns:1fr;max-width:560px}
    .liv-chancelas{grid-template-columns:repeat(2,1fr)}
  }
  @media (max-width:900px){
    /* os três cartões grandes deslizam na horizontal, como as prateleiras */
    .loja-cards{
      display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);scrollbar-width:none;
      margin-inline:calc(-1 * var(--gutter));padding:6px var(--gutter) 14px;-webkit-overflow-scrolling:touch;gap:14px;max-width:none;
    }
    .loja-cards::-webkit-scrollbar{display:none}
    /* cada cartão deixa à vista uma boa fatia do seguinte: percebe-se que desliza */
    .loja-card{flex:0 0 min(72%,300px);scroll-snap-align:start}
    /* a animação de entrada não pode esconder o cartão que espreita à direita */
    .loja-cards .reveal{opacity:1;transform:none}
    .loja-card-capa{height:clamp(200px,42vw,250px)}
    .loja-hero-linha{flex-direction:column;align-items:flex-start;gap:18px}
    .loja-ajuda{
      display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;
      justify-items:start;text-align:left;padding-bottom:0;
    }
    .loja-tranquilo-grid{grid-template-columns:1fr;gap:20px}
    .loja-tranquilo-grid > div{grid-template-columns:auto 1fr;column-gap:14px;align-items:center}
    .loja-icone,.loja-tranquilo-grid > div > .loja-cara{grid-row:span 2;margin-bottom:0}
  }

  /* abaixo de 1024px os filtros passam a painel deslizante */
  @media (max-width:1024px){
    .liv-layout{grid-template-columns:1fr}
    .liv-btn-filtros{display:inline-flex}
    .liv-fundo{
      display:block;position:fixed;left:0;right:0;bottom:0;top:var(--menu-h,86px);z-index:60;background:rgba(22,18,15,.42);
      opacity:0;pointer-events:none;transition:opacity .3s ease;
      backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);
    }
    .liv-fundo.is-on{opacity:1;pointer-events:auto}
    .liv-painel{
      position:fixed;z-index:61;top:var(--menu-h,86px);bottom:0;right:0;width:min(340px,88vw);
      display:flex;flex-direction:column;
      background:var(--paper);box-shadow:-24px 0 60px -30px rgba(22,18,15,.6);
      transform:translateX(100%);transition:transform .42s var(--ease);
    }
    .liv-painel.is-on{transform:none}
    .liv-painel-topo{
      display:flex;align-items:center;justify-content:space-between;
      padding:18px var(--gutter);border-bottom:1px solid var(--line);
    }
    .liv-painel-topo strong{font-family:var(--font-nav);font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
    .liv-painel-topo button{font-size:1.05rem;color:var(--muted);padding:4px 6px}
    .liv-rail{overflow-y:auto;padding:22px var(--gutter);flex:1}
    .liv-painel-fundo{display:block;padding:16px var(--gutter);border-top:1px solid var(--line)}
    .liv-painel-fundo .btn{width:100%;justify-content:center}
    body.filtros-abertos .chat{opacity:0;pointer-events:none}
  }

  /* o ícone e a lista do «ordenar» só existem em ecrã pequeno */
  .liv-ordem-btn,.liv-ordem-menu{display:none}
  .liv-ordem-menu[hidden]{display:none !important}

  @media (max-width:760px){
    /* a barra fica por cima da lista: o desfoque do fundo cria um contexto
       próprio e, sem z-index, o menu de ordenar ficava atrás dos livros */
    .liv-band{position:relative;top:auto;z-index:25;padding-block:12px}   /* top:auto — o top do sticky do desktop empurrava a barra 86px para baixo */
    /* uma linha só: voltar (ícone), a procura a esticar, e os dois ícones à direita */
    .liv-barra{flex-wrap:nowrap;gap:8px}
    .liv-voltar{
      order:0;width:40px;height:40px;justify-content:center;padding:0;margin:0;
      border:1px solid var(--line-strong);border-radius:50%;background:#fff;
    }
    .liv-voltar span{display:none}
    .liv-campo{order:1;flex:1 1 auto;width:auto;min-width:0;margin-left:0;padding:.45em .9em}
    .liv-btn-filtros{order:2;position:relative;width:40px;height:40px;padding:0;justify-content:center}
    .liv-btn-filtros span{display:none}
    .liv-btn-filtros[aria-expanded="true"],.liv-btn-filtros:has(b:not([hidden])){border-color:var(--red);color:var(--red)}
    .liv-btn-filtros b{position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;font-size:.64rem}
    .liv-ordem{order:3;position:relative}
    .liv-ordem label,.liv-ordem select{display:none}
    .liv-ordem-btn{
      display:grid;place-items:center;width:40px;height:40px;border-radius:50%;
      border:1px solid var(--line-strong);background:#fff;color:var(--ink-soft);
    }
    .liv-ordem-btn svg{width:18px;height:18px}
    .liv-ordem-btn[aria-expanded="true"]{border-color:var(--red);color:var(--red)}
    .liv-ordem-menu{
      display:grid;gap:2px;position:absolute;right:0;top:calc(100% + 8px);z-index:30;min-width:210px;padding:6px;
      background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-md);
      animation:livMenuEntra .2s var(--ease) both;
    }
    .liv-ordem-menu button{text-align:left;padding:10px 12px;border-radius:10px;font-size:.9rem;color:var(--ink)}
    .liv-ordem-menu button.is-on{background:var(--red-soft);color:var(--red);font-weight:600}
    /* «limpar tudo» no fundo do painel de filtros */
    .liv-limpar--painel{display:block;width:100%;margin-top:10px;padding:.7em;text-align:center;font-size:.86rem;color:var(--red)}
    .liv-limpar--painel[hidden]{display:none}
    /* grelha uniforme: três colunas iguais, a capa centrada em cada uma */
    .liv-book{--liv-capa-h:clamp(150px,38vw,190px)}
    .grelha-livros{gap:24px 12px}
    .grelha-livros .book{flex:1 1 calc(33.333% - 8px);max-width:calc(33.333% - 8px);width:auto}
    .grelha-livros .book .book-cover{justify-content:center;width:100%;min-width:0}
    /* em colunas iguais a capa não pode ser mais larga do que a coluna: as
       quadradas da Meialonga encolhem para caber, mantendo a proporção */
    .grelha-livros .book .book-cover img{max-width:100%;height:var(--liv-capa-h);width:auto;object-fit:contain}
    .grelha-livros .book .book-cover img.capa-larga{width:100%;height:auto;max-height:none}
  }
  @keyframes livMenuEntra{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
  @media (max-width:520px){
    .loja-rail{gap:18px}
    .loja-saudacao{font-size:clamp(2rem,8.4vw,2.6rem)}
    /* no telemóvel, duas colunas com capas maiores */
    .liv-book{--liv-capa-h:clamp(190px,50vw,230px)}
    .grelha-livros .book{flex-basis:calc(50% - 6px);max-width:calc(50% - 6px)}
  }