.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Compact page header */
.a-hero{padding-block:clamp(1.25rem,2.5vw,2rem) .9rem}
.crumbs{display:flex;gap:.5rem;font-size:var(--text-xs);color:var(--muted);margin-bottom:.9rem}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs a:hover{color:var(--plum)}
.a-hero h1{font-size:clamp(2rem,1.5rem + 2vw,3rem);color:var(--plum)}
.a-lede{color:var(--muted);margin-top:.5rem;max-width:64ch;text-wrap:pretty}

/* Search + filters (sticky on larger screens) */
.a-tools{background:var(--bg);border-bottom:1px solid var(--line);padding-block:.9rem 1rem;z-index:40}
@media (min-width:760px){.a-tools{position:sticky;top:76px}}
.a-tools.stuck{box-shadow:0 10px 24px -20px rgba(40,20,30,.45)}
.a-search{position:relative;display:flex;gap:.6rem;align-items:center;max-width:820px}
.a-field{position:relative;flex:1;min-width:0}
.a-search input{width:100%;font:inherit;font-size:var(--text-base);padding:1rem 2.8rem 1rem 3rem;border:2px solid var(--plum);border-radius:999px;background:#fff;color:var(--ink);-webkit-appearance:none;appearance:none}
.a-search input::placeholder{color:#8a8490}
.a-search input:focus{outline:none;border-color:var(--teal-ink);box-shadow:0 0 0 4px rgba(0,193,169,.2)}
.a-search input::-webkit-search-cancel-button{display:none}
.a-search-icon{position:absolute;left:1.1rem;top:50%;transform:translateY(-50%);color:var(--plum);pointer-events:none}
.a-clear{position:absolute;right:.7rem;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;border:0;background:var(--plum-soft);color:var(--plum);font-size:1.2rem;line-height:1;cursor:pointer}
.a-search .btn{flex:none}
.a-filters{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem 1.5rem;margin-top:.85rem}
.chips{display:flex;flex-wrap:wrap;gap:.45rem}
.chip{font:500 var(--text-sm)/1 var(--font-body);padding:.55rem .85rem;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;white-space:nowrap;transition:background-color .2s,border-color .2s,color .2s}
.chip:hover{border-color:var(--plum);color:var(--plum)}
.chip[aria-pressed="true"]{background:var(--plum);border-color:var(--plum);color:#fff}
.chip .n{opacity:.65;margin-left:.3rem;font-size:var(--text-xs)}
.a-controls{display:flex;align-items:center;gap:.75rem}
.a-count{font-size:var(--text-sm);color:var(--muted);white-space:nowrap}
.a-count strong{color:var(--ink)}
.a-select{font:inherit;font-size:var(--text-sm);padding:.5rem 2rem .5rem .8rem;border:1px solid var(--line);border-radius:10px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%234F253C' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right .7rem center;-webkit-appearance:none;appearance:none;color:var(--ink);cursor:pointer}
.view-toggle{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.view-toggle button{width:36px;height:34px;border:0;background:none;color:var(--muted);cursor:pointer;display:grid;place-items:center}
.view-toggle button[aria-pressed="true"]{background:var(--plum-soft);color:var(--plum)}

/* Results */
.a-results{padding-block:1.5rem clamp(2.5rem,5vw,4rem)}
.a-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem}
.card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:12px;padding:1rem 1.1rem 1.05rem;text-decoration:none;color:inherit;transition:border-color .2s,box-shadow .2s,transform .2s var(--ease)}
.card:hover{border-color:var(--teal);box-shadow:0 14px 30px -24px rgba(40,20,30,.55);transform:translateY(-2px)}
.card .meta{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-size:var(--text-xs);color:var(--muted)}
.tagp{font-weight:700;color:var(--navy);background:#e8f0f5;border-radius:999px;padding:.2rem .55rem}
.card h2{font-family:var(--font-body);font-weight:700;font-size:var(--text-base);line-height:1.35;color:var(--plum);margin-top:.55rem;letter-spacing:0;text-wrap:pretty}
.card p{font-size:var(--text-sm);color:var(--muted);margin-top:.4rem;line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card .by{margin-top:auto;padding-top:.7rem;font-size:var(--text-xs);color:var(--muted);display:flex;justify-content:space-between;gap:.5rem}
.card .by span:last-child{font-weight:700;color:var(--navy)}
mark{background:#fff1b8;color:inherit;border-radius:2px;padding:0 .05em}

/* Compact list view */
.a-grid.list{display:block;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.a-grid.list .card{flex-direction:row;align-items:baseline;gap:1rem;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:.7rem 1.1rem;transform:none;box-shadow:none}
.a-grid.list .card:last-child{border-bottom:0}
.a-grid.list .card:hover{background:var(--tint)}
.a-grid.list .card .meta{order:-1;flex:none;width:11.5rem;flex-wrap:nowrap}
.a-grid.list .card h2{margin-top:0;flex:1;font-weight:600}
.a-grid.list .card p{display:none}
.a-grid.list .card .by{margin:0;padding:0;flex:none;width:9rem;justify-content:flex-end}
.a-grid.list .card .by span:last-child{display:none}
@media (max-width:700px){
  .a-grid.list .card{flex-direction:column;gap:.25rem}
  .a-grid.list .card .meta{width:auto}
  .a-grid.list .card .by{display:none}
}

/* Empty state */
.a-empty{text-align:center;padding:3rem 1rem;border:1.5px dashed #cbbfca;border-radius:14px}
.a-empty h2{font-size:var(--text-lg);font-family:var(--font-body);font-weight:700;letter-spacing:0}
.a-empty p{color:var(--muted);margin-top:.5rem}
.a-suggest{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin:1rem 0 1.4rem}
.a-suggest button{font:500 var(--text-sm)/1 var(--font-body);padding:.55rem .9rem;border-radius:999px;border:1px solid var(--line);background:#fff;cursor:pointer}
.a-suggest button:hover{border-color:var(--plum);color:var(--plum)}

/* Bottom CTA */
.a-cta{padding-block:2rem 3.5rem}
.a-cta .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2rem}
.a-cta p{color:var(--muted)}
.a-cta strong{color:var(--plum)}
.a-cta-actions{display:flex;flex-wrap:wrap;gap:.6rem}

@media (max-width:640px){
  .a-search .btn{display:none}
  .a-search input{padding-right:2.8rem}
  .chips{flex-wrap:nowrap;overflow-x:auto;margin-inline:calc(-1 * clamp(1.25rem,4vw,2.5rem));padding-inline:clamp(1.25rem,4vw,2.5rem);scrollbar-width:none}
  .chips::-webkit-scrollbar{display:none}
  .a-filters{flex-direction:column;flex-wrap:nowrap;align-items:stretch}
  .chips{min-width:0}
  .a-controls{justify-content:space-between}
  .a-grid{grid-template-columns:1fr}
}

/* Compact the pinned bar so more articles stay visible */
@media (min-width:760px){
  .a-tools{transition:padding .2s}
  .a-tools.stuck{padding-block:.6rem .65rem}
  .a-tools.stuck .a-search input{padding-block:.7rem}
  .a-tools.stuck .a-search .btn{padding-block:.75rem}
  .a-tools.stuck .a-filters{margin-top:.55rem}
  .a-tools.stuck .a-controls{display:none}
  .a-tools.stuck .chip{padding:.45rem .75rem}
}

/* Article thumbnails */
.card .thumb{display:block;margin:-1rem -1.1rem .85rem;aspect-ratio:16/9;overflow:hidden;border-radius:11px 11px 0 0;background:var(--tint)}
.card .thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease)}
.card:hover .thumb img{transform:scale(1.03)}
.a-grid.list .card.has-thumb{align-items:center}
.a-grid.list .card .thumb{margin:0;flex:none;width:76px;aspect-ratio:3/2;border-radius:6px;order:-2}
.a-grid.list .card .meta{order:-1}
@media (max-width:700px){.a-grid.list .card .thumb{display:none}}
@media (prefers-reduced-motion:reduce){.card .thumb img{transition:none}.card:hover .thumb img{transform:none}}
.a-grid.list .card .tagp{white-space:nowrap}
.a-grid.list .card.has-thumb .meta{width:15rem}
.a-grid.list .card time{white-space:nowrap}