/* Catálogo com ordenação + filtros (padrão Radar das Raras, no visual da loja).
   Reusa product-page.css (design creme + .rel-grid/.rel-card). */

.llstore-pp .cat-head { max-width:1220px; margin:0 auto; padding:36px 20px 0; }
.llstore-pp .cat-head .kicker { color:var(--gold-deep); display:flex; align-items:center; gap:8px; }
.llstore-pp .cat-head .kicker::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--gold-deep); }
.llstore-pp .cat-head h1 { font-family:var(--serif); font-size:2.6rem; font-weight:400; line-height:1.04; margin:6px 0 8px; }
.llstore-pp .cat-head .sub { font-size:1rem; font-weight:300; color:var(--ink-mut); max-width:62ch; }

/* barra de controles */
.llstore-pp .cat-bar { max-width:1220px; margin:20px auto 0; padding:0 20px; display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.llstore-pp .cat-count { font-size:0.86rem; color:var(--ink-mut); }
.llstore-pp .cat-count b { color:var(--ink); font-weight:600; }
.llstore-pp .cat-controls { margin-left:auto; display:flex; align-items:center; gap:10px; }
.llstore-pp .cat-sort, .llstore-pp .filter-btn {
	height:42px; padding:0 16px; border:1px solid var(--hair-ink); border-radius:999px; background:#fff;
	font-family:var(--sans); font-size:0.86rem; font-weight:500; color:var(--ink); cursor:pointer; }
.llstore-pp .cat-sort { padding-right:34px; -webkit-appearance:none; appearance:none;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none'%3E%3Cpath d='m2 4 4 4 4-4' stroke='%23171308' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat:no-repeat; background-position:right 14px center; }
.llstore-pp .filter-wrap { position:relative; }
.llstore-pp .filter-btn { display:inline-flex; align-items:center; gap:8px; }
.llstore-pp .filter-btn .fc { color:var(--gold-deep); font-weight:700; }
.llstore-pp .filter-panel { position:absolute; z-index:30; right:0; margin-top:8px; width:300px; max-height:74vh; overflow-y:auto;
	background:#fff; border:1px solid var(--hair-ink); border-radius:16px; box-shadow:0 24px 60px rgba(23,19,8,0.22); padding:6px 6px 0; }
.llstore-pp .filter-panel[hidden] { display:none; }
.llstore-pp .filter-sec { padding:12px 12px 4px; }
.llstore-pp .filter-sec + .filter-sec { border-top:1px solid var(--hair-ink); }
.llstore-pp .filter-h { font-size:0.7rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink-mut-2); margin-bottom:8px; }
.llstore-pp .filter-search { width:100%; height:36px; margin-bottom:8px; padding:0 12px; border:1px solid var(--hair-ink); border-radius:8px; font-family:var(--sans); font-size:0.85rem; outline:none; }
.llstore-pp .filter-opt { display:flex; align-items:center; gap:9px; padding:6px 4px; font-size:0.88rem; color:var(--ink); cursor:pointer; }
.llstore-pp .filter-opt:hover { color:var(--gold-deep); }
.llstore-pp .filter-opt input { accent-color:var(--gold-deep); width:15px; height:15px; }
.llstore-pp .filter-opt .n { margin-left:auto; font-size:0.76rem; color:var(--ink-mut-2); }
.llstore-pp .filter-opt.hide { display:none; }
.llstore-pp .filter-foot { position:sticky; bottom:0; display:flex; align-items:center; gap:8px; margin-top:8px; padding:10px 12px; background:#fff; border-top:1px solid var(--hair-ink); border-radius:0 0 16px 16px; }
.llstore-pp .filter-clear { border:1px solid var(--hair-ink); background:none; color:var(--ink-mut); font-size:0.76rem; font-weight:600; border-radius:999px; padding:7px 14px; cursor:pointer; }
.llstore-pp .filter-clear:hover { color:var(--gold-deep); border-color:var(--gold-deep); }
.llstore-pp .filter-apply { margin-left:auto; border:0; background:linear-gradient(180deg,var(--gold-soft),var(--gold-deep)); color:var(--black); font-size:0.76rem; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; border-radius:999px; padding:8px 22px; cursor:pointer; }

/* grid */
.llstore-pp .cat-wrap { max-width:1220px; margin:0 auto; padding:22px 20px 56px; }
.llstore-pp .cat-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:18px 16px; }
.llstore-pp .cat-item.hide { display:none; }
.llstore-pp .cat-empty { padding:40px 0; text-align:center; color:var(--ink-mut); font-size:0.95rem; }
.llstore-pp .cat-empty[hidden] { display:none; }

/* ---- About: foto + bio ---- */
.llstore-pp .about-bio { max-width:1220px; margin:0 auto; padding:24px 20px 8px; display:grid; grid-template-columns:1fr; gap:22px; align-items:start; }
.llstore-pp .about-bio .bio-photo img { width:100%; max-width:320px; border-radius:14px; border:1px solid var(--hair-ink); box-shadow:0 22px 46px rgba(23,19,8,0.2); }
.llstore-pp .about-bio .bio-text h2 { font-family:var(--serif); font-size:1.8rem; font-weight:400; margin-bottom:12px; }
.llstore-pp .about-bio .bio-text p { font-size:1rem; font-weight:300; color:var(--ink-mut); margin-bottom:12px; max-width:62ch; }
@media (min-width:820px) {
	.llstore-pp .about-bio { grid-template-columns:0.7fr 1.3fr; gap:44px; padding-left:40px; padding-right:40px; padding-top:32px; }
}

/* ---- composers: accordion no card ---- */
.llstore-pp .comp-card { text-align:left; }
.llstore-pp .comp-card .acc-toggle { display:flex; align-items:center; gap:6px; margin-top:10px; font-size:0.72rem; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:var(--gold-deep); background:none; border:0; cursor:pointer; padding:0; font-family:var(--sans); }
.llstore-pp .comp-card .acc-toggle svg { transition:transform 0.25s var(--ease); }
.llstore-pp .comp-card.open .acc-toggle svg { transform:rotate(180deg); }
.llstore-pp .comp-card .acc-body { display:none; margin-top:10px; border-top:1px solid var(--hair-ink); padding-top:8px; }
.llstore-pp .comp-card.open .acc-body { display:block; }
.llstore-pp .comp-card .acc-row { display:flex; align-items:baseline; justify-content:space-between; gap:10px; padding:5px 0; font-size:0.82rem; }
.llstore-pp .comp-card .acc-row .an { color:var(--ink); }
.llstore-pp .comp-card .acc-row:hover .an { color:var(--gold-deep); }
.llstore-pp .comp-card .acc-row .ap { color:var(--gold-deep); font-weight:600; white-space:nowrap; }

@media (min-width:720px) {
	.llstore-pp .cat-grid { grid-template-columns:repeat(3, minmax(0,1fr)); }
}
@media (min-width:960px) {
	.llstore-pp .cat-head, .llstore-pp .cat-bar, .llstore-pp .cat-wrap { padding-left:40px; padding-right:40px; }
	.llstore-pp .cat-head { padding-top:52px; }
	.llstore-pp .cat-head h1 { font-size:3.4rem; }
	.llstore-pp .cat-grid { grid-template-columns:repeat(4, minmax(0,1fr)); gap:20px; }
}
