.dir-head{padding:clamp(2.5rem,6vw,4.5rem) 0 var(--s6)}
.dir-head h1{font-size:var(--text-2xl);max-width:22ch}
.help-now{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s3);margin:var(--s5) 0 0}
.help-now a{display:block;background:var(--paper);border:1px solid var(--line-2);border-radius:var(--r);padding:.9rem 1rem;text-decoration:none;color:var(--ink);font-size:var(--text-sm)}
.help-now a b{display:block;color:var(--red);font-size:var(--text-lg);font-family:var(--font-display)}
.help-now a:hover{border-color:var(--navy)}
@media (max-width:760px){.help-now{grid-template-columns:1fr}}

.dir-tools{position:sticky;top:76px;z-index:30;background:rgba(246,242,234,.97);backdrop-filter:blur(8px);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:var(--s4) 0}
.dt-row{display:grid;grid-template-columns:2fr 1.1fr auto;gap:var(--s3);align-items:end}
.dt-row label{display:grid;gap:.3rem;font-size:var(--text-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.dt-row input,.dt-row select{height:46px;border:1.5px solid var(--line);border-radius:var(--r);padding:0 .9rem;font:var(--text-base) var(--font-body);background:#fff;color:var(--ink);width:100%}
.dt-row input:focus,.dt-row select:focus{outline:0;border-color:var(--navy);box-shadow:0 0 0 3px rgba(13,63,115,.15)}
.dt-row .btn{height:46px}
.chips{display:flex;gap:.45rem;margin-top:var(--s3);overflow-x:auto;padding-bottom:2px;scrollbar-width:thin}
.chip{flex-shrink:0;border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:.45rem .85rem;font:500 var(--text-sm) var(--font-body);color:var(--ink);cursor:pointer;white-space:nowrap}
.chip span{color:var(--mute);font-size:var(--text-xs);margin-left:.2rem}
.chip:hover{border-color:var(--navy)}
.chip[aria-pressed=true]{background:var(--navy);border-color:var(--navy);color:#fff}
.chip[aria-pressed=true] span{color:#cfdcec}
.chip.faith[aria-pressed=true]{background:var(--gold);border-color:var(--gold)}
.dt-meta{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);margin-top:var(--s3);font-size:var(--text-sm);color:var(--mute);flex-wrap:wrap}
.dt-meta button{background:none;border:0;color:var(--navy);font:600 var(--text-sm) var(--font-body);cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:.18em}
@media (max-width:760px){
  .dir-tools{position:static}
  .dt-row{grid-template-columns:1fr 1fr}
  .dt-row label:first-child{grid-column:1/-1}
}

.co-nav{display:flex;flex-wrap:wrap;gap:.3rem .9rem;font-size:var(--text-sm);margin:var(--s5) 0 0}
.co-nav a{color:var(--navy);text-decoration:none}
.co-nav a:hover{text-decoration:underline}
.co-nav a[aria-current=page]{font-weight:700;color:var(--red)}

.cogrp{padding-top:var(--s6)}
.coh{font-size:var(--text-xl);display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem .9rem;border-bottom:2px solid var(--navy-ink);padding-bottom:.6rem;margin-bottom:var(--s4)}
.coh .n{font-family:var(--font-body);font-size:var(--text-sm);font-weight:500;color:var(--mute)}
.coh .pl{font-family:var(--font-body);font-size:var(--text-xs);font-weight:600;margin-left:auto;text-transform:uppercase;letter-spacing:.08em}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:var(--s4)}
@media (max-width:420px){.grid{grid-template-columns:1fr}}
.res{background:var(--paper);border:1px solid var(--line-2);border-radius:var(--r);padding:var(--s5);display:flex;flex-direction:column;gap:.55rem;font-size:var(--text-sm);min-width:0}
.res.feat{border-color:#cdbb92;box-shadow:inset 0 3px 0 var(--gold)}
.res header{display:flex;gap:.8rem;align-items:flex-start}
.res .lg{width:56px;height:56px;object-fit:contain;border-radius:8px;background:#fff;border:1px solid var(--line-2);flex-shrink:0;padding:3px}
.res h3{font-size:1.02rem;line-height:1.3;margin:0;color:var(--navy-ink);overflow-wrap:anywhere}
.res .co{margin:.15rem 0 0;font-size:var(--text-xs);color:var(--mute)}
.pick,.fb{display:inline-block;font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:.1rem .45rem;border-radius:4px;margin-left:.25rem;vertical-align:1px}
.pick{background:#f5ecd6;color:#7a5a17}.fb{background:#e6edf5;color:var(--navy)}
.tags{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.3rem}
.tag{font-size:.72rem;font-weight:600;padding:.15rem .5rem;border-radius:999px;background:var(--soft);color:var(--ink)}
.t-H{background:#e5eef8;color:#0d3f73}.t-E{background:#e8f2e6;color:#2a5a23}.t-S{background:#f6e7e3;color:#8a2e1f}
.t-M{background:#eee7f6;color:#4f3478}.t-I{background:#f6efdc;color:#6d520f}.t-R{background:#fbe5e7;color:#8c1b23}
.t-L{background:#e3f1f1;color:#1d5858}.t-F{background:#f3eee2;color:#5c4a22}.t-C{background:#e9f0f6;color:#29506f}
.res .d{margin:0;color:var(--ink)}
.res .el{margin:0;color:var(--mute)}
.ct{margin:.2rem 0 0;display:grid;gap:.25rem}
.ct div{display:grid;grid-template-columns:4.6rem 1fr;gap:.5rem}
.ct dt{font-size:var(--text-xs);color:var(--mute);font-weight:600;padding-top:.1rem}
.ct dd{margin:0;overflow-wrap:anywhere}
.warn{margin:0;font-size:var(--text-xs);background:#fdf3e1;color:#7a4b06;padding:.35rem .6rem;border-radius:6px}
[hidden]{display:none!important}
.empty{background:var(--paper);border:1px dashed var(--line);border-radius:var(--r-lg);padding:var(--s7);text-align:center;margin-top:var(--s6)}
.empty h2{font-size:var(--text-xl)}
.suggest{margin-top:var(--s8)}
