/* =========================================
   LEGAL RESOURCES — PRO LIGHT THEME (fixed)
========================================== */
.r4-lr{
  --accent:#6C4AB6; --accent-ink:#fff;
  --heading:#2A2140; --text:#2E2A33; --muted:#6E647F;
  --border:#E8E3F2; --ring:rgba(108,74,182,.18);
  --page:#FAF9FE; --panel:#fff;

  font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  padding:2rem; max-width:1200px; margin:0 auto; width:100%; background:var(--page);
}

.r4-lr__head{ text-align:center; margin-bottom:1.25rem; }
.r4-lr__title,.r4-lr__sub,.r4-lr__category-title{ font-family:"Rubik",system-ui,sans-serif; }
.r4-lr__title{ margin:0; font-weight:800; color:var(--heading); font-size:clamp(1.8rem,2.8vw,2.4rem); letter-spacing:.1px; }
.r4-lr__sub{ margin:.5rem 0 0; color:var(--muted); }

/* Search */
.r4-lr__search{ position:relative; max-width:820px; margin:1.25rem auto 1.75rem; }
.r4-lr__search input{
  width:100%; background:#fff; color:var(--text); border:1.5px solid var(--border); border-radius:12px;
  padding:.95rem 1.1rem; font-size:1rem; box-shadow:none; transition:border-color .18s, box-shadow .18s;
}
.r4-lr__search input::placeholder{ color:#9B94A7; }
.r4-lr__search input:focus{ border-color:var(--accent); box-shadow:0 0 0 3px var(--ring); outline:none; }

/* Results dropdown */
.r4-lr__results{
  position:absolute; left:0; right:0; top:calc(100% + .5rem);
  background:var(--panel); border:1.5px solid var(--border); border-radius:12px; box-shadow:none;
  padding:.35rem; z-index:999; max-height:420px; overflow:auto; pointer-events:auto;
}
.r4-lr__status{ padding:.65rem .75rem; color:var(--muted); font-size:.95rem; }
.r4-lr__list{ list-style:none; padding:0; margin:0; }
.r4-lr__list a{
  display:block; padding:.7rem .8rem; border-radius:10px; border:1px solid transparent;
  text-decoration:none; color:var(--text); font-weight:600; transition:background .15s, color .15s, border-color .15s;
}
.r4-lr__list a:hover,.r4-lr__list a:focus{ background:#F5F2FB; border-color:#ECE6FA; color:var(--accent); outline:none; }

/* Card container */
.r4-lr__card{ background:var(--panel); border:1px solid var(--border); border-radius:16px; padding:1.2rem; box-shadow:none; }

/* Grid */
.r4-lr__grid{
  display:grid; gap:1.25rem 1.5rem;
  grid-template-columns:repeat(auto-fit, minmax(200px,1fr));
  position:relative; transition:max-height .35s ease;
  overflow:visible;                /* visible when expanded */
  max-height:none;                 /* no cap when expanded */
}
/* Collapsed state only */
.r4-lr__grid--collapsed{
  max-height:16rem;
  overflow:hidden;                 /* hide only while collapsed */
}

@media (max-width:768px){ .r4-lr__grid{ grid-template-columns:repeat(auto-fit, minmax(160px,1fr)); } }
@media (max-width:480px){ .r4-lr__grid{ grid-template-columns:1fr; } }

/* Category */
.r4-lr__category{ display:flex; flex-direction:column; gap:.6rem; }
.r4-lr__category-title{
  margin:0 0 .35rem; padding-bottom:.25rem; font-weight:700; color:var(--accent); font-size:1.05rem;
  border-bottom:2px solid #EFEAFA;
}

/* Items */
.r4-lr__grid ul{ margin:0; padding:0; list-style:none; }
.r4-lr__grid li{
  margin:.4rem 0; background:#FBFAFF; border:1px solid #F0ECF8; border-radius:10px; transition:background .15s, border-color .15s;
}
.r4-lr__grid li:hover,.r4-lr__grid li:focus-within{ background:#F6F2FE; border-color:#E7E0F8; }
.r4-lr__grid a{
  position:relative; display:flex; align-items:center; gap:.6rem; padding:.7rem .85rem; color:var(--text); text-decoration:none; font-weight:600;
}
.r4-lr__grid a::before{
  content:''; width:.95rem; height:.95rem; flex:0 0 .95rem;
  background:url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBmaWxsPSJub25lIj48cGF0aCBkPSJNOC45IDEySDIwIiBzdHJva2U9IiM2QzRBQjYiIHN0cm9rZS13aWR0aD0iMS42IiBzdHJva2UtbGluZWNhcD0icm91bmQiLz48cGF0aCBkPSJNMTIgMjBBOCA4IDAgMSAxIDEyIDQgOCA4IDAgMCAxIDEyIDIwWiIgc3Ryb2tlPSIjQkFBMEVGIiBzdHJva2Utd2lkdGg9IjEuNiIvPjwvc3ZnPg==') center/contain no-repeat;
  opacity:.9; transition:transform .16s ease;
}
.r4-lr__grid a:hover::before,.r4-lr__grid a:focus::before{ transform:translateX(1px); }

/* Underline on hover (subtle) */
.r4-lr__grid a::after{
  content:''; position:absolute; left:.85rem; right:.85rem; bottom:.5rem; height:1.5px; width:0;
  background:linear-gradient(90deg, var(--accent), rgba(108,74,182,0)); transition:width .18s ease;
}
.r4-lr__grid a:hover::after,.r4-lr__grid a:focus::after{ width:calc(100% - 1.7rem); }
.r4-lr__grid a:hover,.r4-lr__grid a:focus{ color:var(--accent); outline:none; }

/* Mask: show only when collapsed */
.r4-lr__mask{
  position:absolute; inset:auto 0 0 0; height:4.5rem; pointer-events:none;
  background:linear-gradient(180deg, rgba(250,249,254,0), var(--panel) 70%);
  display:block;
}
.r4-lr__grid:not(.r4-lr__grid--collapsed) .r4-lr__mask{ display:none; }  /* hide mask when expanded */

/* Toggle (clean pill) */
.r4-lr__toggle{
  display:inline-flex; align-items:center; justify-content:center; margin:1.1rem auto 0;
  padding:.65rem 1.1rem; border-radius:999px; border:1px solid var(--border);
  background:#fff; color:var(--heading); font-weight:700; letter-spacing:.2px; cursor:pointer;
  transition:border-color .15s, background .15s, color .15s;
}
.r4-lr__toggle:hover{ border-color:#DAD3EE; background:#F8F6FD; }
.r4-lr__toggle:focus{ outline:none; box-shadow:0 0 0 3px var(--ring); }
.r4-lr__toggle:active{ background:#F2EEFB; }

@media (max-width:520px){
  .r4-lr{ padding:1.25rem; }
  .r4-lr__card{ padding:1rem; }
}

/* ================================
   Filtering + UX helpers (fixed)
   ================================ */
.r4-lr__grid .is-hidden { display:none !important; }
.r4-lr__category.is-empty { display:none !important; }

/* Optional pulse highlight when jumping to a result */
.r4-lr__grid a.-pulse { animation:r4lrPulse 1.2s ease-out 1; }
@keyframes r4lrPulse {
  0% { box-shadow:0 0 0 0 rgba(108,74,182,.35); }
  100% { box-shadow:0 0 0 16px rgba(108,74,182,0); }
}
