/* ──────────────────────────────────────────────────────────────────────────
   EB.Academy Directory — list navigation chrome
   • "Back to results" link (all breakpoints)
   • Mobile filter bottom-sheet (≤860px only; desktop is left completely alone)
   The page's own <style> owns the desktop rail. Every drawer rule here is
   scoped to ≤860px or to the JS-added .flt-sheet class, so it can only ever
   override the page on small screens — desktop renders exactly as before.
   ────────────────────────────────────────────────────────────────────────── */

/* Back to results ----------------------------------------------------------- */
.dir-back{
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--body,sans-serif);font-size:13px;font-weight:600;
  color:var(--muted,#6B7E93);background:none;border:none;cursor:pointer;
  padding:6px 0;transition:color .18s;
}
.dir-back:hover{color:var(--navy,#0F1B2D);}
.dir-back .ar{font-size:15px;line-height:1;}

/* Drawer chrome is hidden by default — only the ≤860 block turns it on ------- */
.flt-trigger,.flt-backdrop,.flt-sheet-head,.flt-sheet-apply{display:none;}

@media(max-width:860px){
  /* Trigger button shown above the results */
  .flt-trigger{
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    width:100%;margin:0 0 18px;padding:13px 16px;
    background:var(--paper,#fff);border:1px solid var(--line,#E4DED2);border-radius:11px;
    font-family:var(--body,sans-serif);font-size:14.5px;font-weight:600;color:var(--navy,#0F1B2D);
    cursor:pointer;box-shadow:0 1px 2px rgba(15,27,45,.05);
  }
  .flt-trigger .ft-l{display:inline-flex;align-items:center;gap:9px;}
  .flt-trigger .ft-n{
    font-size:12px;font-weight:700;color:#fff;background:var(--orange,#EB6E21);
    border-radius:20px;padding:2px 9px;min-width:20px;text-align:center;
  }
  .flt-trigger .ft-n:empty{display:none;}

  /* Backdrop */
  .flt-backdrop{
    display:block;position:fixed;inset:0;background:rgba(10,21,32,.46);
    opacity:0;pointer-events:none;transition:opacity .25s;z-index:90;
  }
  .flt-backdrop.on{opacity:1;pointer-events:auto;}

  /* The rail becomes a bottom sheet. .rail.flt-sheet (0,2,0) outranks the
     page's @media .rail (0,1,0) rules, so this wins without !important. */
  .rail.flt-sheet{
    position:fixed;left:0;right:0;bottom:0;top:auto;z-index:100;
    display:block;grid-template-columns:none;
    max-height:86vh;overflow-y:auto;-webkit-overflow-scrolling:touch;
    background:var(--cream,#F0EDE6);
    border-radius:18px 18px 0 0;
    box-shadow:0 -14px 44px rgba(15,27,45,.24);
    padding:0 18px calc(20px + env(safe-area-inset-bottom,0px));
    transform:translateY(101%);transition:transform .28s cubic-bezier(.4,0,.2,1);
    margin:0;
  }
  .rail.flt-sheet.open{transform:translateY(0);}

  /* Sheet header (sticky) + apply button (sticky) */
  .flt-sheet-head{
    display:flex;align-items:center;justify-content:space-between;
    position:sticky;top:0;z-index:2;background:var(--cream,#F0EDE6);
    padding:18px 2px 12px;margin-bottom:6px;border-bottom:1px solid var(--line,#E4DED2);
  }
  .flt-sheet-head strong{font-family:var(--serif,sans-serif);font-size:18px;font-weight:800;color:var(--navy,#0F1B2D);}
  .flt-sheet-x{
    appearance:none;border:none;background:none;font-size:27px;line-height:1;
    color:var(--muted,#6B7E93);cursor:pointer;padding:0 6px;margin:-4px -6px;
  }
  .flt-sheet-apply{
    display:block;width:100%;margin-top:10px;position:sticky;bottom:0;
  }

  body.flt-open{overflow:hidden;}
}

/* Quick-view slide-over (desktop/laptop) — shared by projects / RC / attorneys.
   top/height are set in JS to sit below the sticky header (no hero clipping). */
.qv-overlay{position:fixed;left:0;top:0;height:100%;width:100%;background:rgba(10,21,32,.74);opacity:0;pointer-events:none;transition:opacity .25s;z-index:200;}
.qv-overlay.on{opacity:1;pointer-events:auto;}
.qv-panel{position:fixed;top:0;right:0;height:auto;width:min(600px,92vw);background:var(--cream,#F0EDE6);box-shadow:-24px 0 64px rgba(15,27,45,.40);transform:translateX(101%);transition:transform .3s cubic-bezier(.4,0,.2,1);z-index:201;display:flex;flex-direction:column;}
.qv-panel.on{transform:translateX(0);}
.qv-x{position:absolute;top:14px;right:16px;z-index:3;appearance:none;border:none;background:rgba(255,255,255,.14);color:#fff;width:32px;height:32px;border-radius:50%;font-size:20px;line-height:1;cursor:pointer;transition:.18s;}
.qv-x:hover{background:rgba(255,255,255,.26);}
.qv-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;}
.qv-hero{background:linear-gradient(135deg,var(--navy,#0F1B2D),var(--navy-2,#162440));color:#fff;padding:26px 30px;}
.qv-top{display:flex;gap:15px;align-items:center;padding-right:34px;}
.qv-logo{width:52px;height:52px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-family:var(--serif,sans-serif);font-weight:700;font-size:18px;flex-shrink:0;overflow:hidden;}
.qv-logo.has-img{background:#fff;}
.qv-logo img{width:100%;height:100%;object-fit:contain;}
.qv-logo.qv-photo img{object-fit:cover;}
.qv-logo.qv-photo{width:74px;height:74px;font-size:25px;}
.qv-name{font-family:var(--serif,sans-serif);font-size:22px;font-weight:700;line-height:1.16;letter-spacing:-.3px;}
.qv-rc{font-size:13px;color:#D7DEE7;margin-top:4px;}
.qv-pills{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px;align-items:center;}
.qv-body{padding:26px 30px;}
.qv-sec{margin-bottom:26px;}
.qv-sec:last-child{margin-bottom:0;}
.qv-over{font-size:11px;letter-spacing:2.5px;font-weight:600;text-transform:uppercase;color:var(--gold,#C8A96E);margin-bottom:10px;}
.qv-sec p{font-size:14.5px;color:#2C3744;line-height:1.72;}
.qv-facts{display:flex;flex-direction:column;}
.qv-f{display:flex;justify-content:space-between;gap:18px;font-size:13.5px;padding:10px 0;border-bottom:1px solid var(--line-2,#EFEAE0);}
.qv-f:last-child{border-bottom:none;}
.qv-f .k{color:#4E5E72;flex:none;}
.qv-f .v{color:var(--navy,#0F1B2D);font-weight:600;text-align:right;}
.qv-f .v a{color:var(--orange-dk,#D4601C);}
.qv-note{font-size:12.5px;color:#7A4A28;background:#FEF0E8;border-radius:9px;padding:11px 14px;display:flex;gap:8px;align-items:flex-start;line-height:1.5;}
.qv-foot{border-top:1px solid var(--line,#E4DED2);background:var(--cream,#F0EDE6);padding:16px 30px;display:flex;gap:12px;flex-shrink:0;}
.qv-foot .btn{flex:1;text-align:center;padding:13px;}
body.qv-open{overflow:hidden;}
@media(max-width:1024px){.qv-panel{width:100vw;}}

/* ── collapsible filter sections (left rail) ── */
.rail .fgroup h4{display:flex;align-items:center;cursor:pointer;user-select:none;-webkit-user-select:none;}
.rail .fgroup h4::after{content:'';width:7px;height:7px;border-right:2px solid var(--muted,#6B7E93);border-bottom:2px solid var(--muted,#6B7E93);transform:rotate(45deg);transition:transform .2s ease;margin-left:auto;flex-shrink:0;position:relative;top:-2px;}
.rail .fgroup.collapsed h4::after{transform:rotate(-45deg);}
.rail .fgroup.collapsed > :not(h4){display:none;}
.rail .fgroup.collapsed{margin-bottom:6px;}
.rail .fgroup.has-active h4::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--orange,#EB6E21);margin-right:8px;flex-shrink:0;}
.rail .fgroup h4:focus-visible{outline:2px solid var(--orange,#EB6E21);outline-offset:3px;border-radius:3px;}
.rail .fgroup.pinned h4{cursor:default;}
.rail .fgroup.pinned h4::after{display:none;}
.rail .fgroup.pinned h4::before{display:none;}
