/* =========================================================
 * Glossario assicurativo — single-page index + entries
 * Allineato al design system dark navy IESolution
 * ========================================================= */

.gl-hero{
  padding: clamp(48px,7vw,96px) 0 clamp(24px,3vw,40px);
  border-bottom:1px solid var(--bd-2);
  position:relative; overflow:hidden;
}
.gl-hero::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(900px 500px at 20% 30%, rgba(0,180,216,.10), transparent 60%),
    radial-gradient(800px 480px at 85% 70%, rgba(0,119,182,.08), transparent 65%);
}
.gl-hero .wrap{position:relative; z-index:1}
.gl-hero h1{
  font-family:var(--serif);
  font-size:clamp(2rem, 3.6vw, 2.8rem);
  margin:0 0 14px;
  letter-spacing:-.01em;
  color:var(--ink);
}
.gl-hero .gl-sub{
  font-size:15.5px;
  line-height:1.6;
  color:var(--ink-2);
  max-width:760px;
  margin:0;
}

/* ===== Alphabetical index ===== */
.gl-alpha{
  position:sticky; top:0; z-index:30;
  background:rgba(10,20,40,.92);
  backdrop-filter:saturate(140%) blur(6px);
  -webkit-backdrop-filter:saturate(140%) blur(6px);
  border-bottom:1px solid var(--bd);
  padding:12px 0;
  margin:24px 0 0;
}
.gl-alpha-inner{
  display:flex; flex-wrap:wrap;
  gap:4px 6px; align-items:center; justify-content:center;
}
.gl-alpha a{
  display:inline-grid; place-items:center;
  min-width:30px; height:30px; padding:0 7px;
  border-radius:3px;
  font-family:var(--mono);
  font-weight:500; font-size:13px;
  color:var(--cyan-300);
  text-decoration:none;
  border:1px solid transparent;
  transition:background .12s ease, border-color .12s ease;
}
.gl-alpha a:hover{
  background:rgba(0,180,216,.08);
  border-color:rgba(0,180,216,.3);
}
.gl-alpha a.disabled{
  color:var(--muted-2);
  pointer-events:none;
  opacity:.45;
}

/* ===== Category filter ===== */
.gl-filter{
  margin:24px 0 8px;
  display:flex; flex-wrap:wrap;
  gap:8px; justify-content:center;
}
.gl-chip{
  display:inline-flex; align-items:center;
  padding:7px 16px;
  border-radius:999px;
  background:rgba(11,18,32,.55);
  border:1px solid var(--bd);
  font-family:var(--sans);
  font-size:13px; font-weight:500;
  color:var(--ink-2);
  cursor:pointer;
  transition:background .12s ease, border-color .12s ease, color .12s ease;
  user-select:none;
}
.gl-chip:hover{
  background:rgba(0,180,216,.06);
  border-color:rgba(0,180,216,.3);
  color:var(--ink);
}
.gl-chip.active{
  background:rgba(0,180,216,.14);
  border-color:rgba(0,180,216,.55);
  color:var(--cyan-300);
}

/* ===== Entry list ===== */
.gl-list{
  max-width:920px;
  margin:32px auto 80px;
  padding:0 16px;
}

.gl-letter-group{margin:36px 0 20px}
.gl-letter-group h2{
  font-family:var(--serif);
  font-size:1.9rem; font-weight:600;
  margin:0 0 14px;
  padding:8px 14px;
  background:rgba(0,180,216,.06);
  border-left:3px solid var(--cyan-500);
  border-radius:0 3px 3px 0;
  letter-spacing:-.01em;
  color:var(--ink);
  scroll-margin-top:80px;
}

.gl-entry{
  padding:22px 4px 22px;
  margin:0;
  border-bottom:1px solid var(--bd-2);
  scroll-margin-top:80px;
}
.gl-entry:last-child{border-bottom:none}
.gl-entry h3{
  font-family:var(--sans);
  font-size:1.05rem; font-weight:600;
  margin:0 0 8px;
  display:flex; flex-wrap:wrap;
  gap:10px; align-items:baseline;
  color:var(--ink);
  letter-spacing:-.005em;
}
.gl-entry .gl-anchor{
  color:var(--muted-2);
  font-size:.85em;
  text-decoration:none;
  margin-left:auto;
  opacity:0;
  transition:opacity .12s ease, color .12s ease;
}
.gl-entry:hover .gl-anchor{opacity:1}
.gl-entry .gl-anchor:hover{color:var(--cyan-400)}

.gl-badge{
  display:inline-block;
  padding:2px 9px;
  border-radius:3px;
  font-family:var(--mono);
  font-size:10.5px;
  font-weight:500;
  letter-spacing:.06em;
  text-transform:uppercase;
  background:rgba(148,163,184,.10);
  color:var(--ink-2);
  border:1px solid rgba(148,163,184,.18);
}
/* Category-tinted badges (dark theme tonal) */
.gl-badge.cat-surety{      background:rgba(245,158,11,.10); border-color:rgba(245,158,11,.30); color:#fcd34d; }
.gl-badge.cat-reinsurance{ background:rgba(59,130,246,.10); border-color:rgba(59,130,246,.30); color:#93c5fd; }
.gl-badge.cat-lloyds{      background:rgba(168,85,247,.10); border-color:rgba(168,85,247,.30); color:#d8b4fe; }
.gl-badge.cat-claims{      background:rgba(248,113,113,.10);border-color:rgba(248,113,113,.30);color:#fca5a5; }
.gl-badge.cat-compliance{  background:rgba(16,185,129,.10); border-color:rgba(16,185,129,.30); color:#6ee7b7; }
.gl-badge.cat-esignature{  background:rgba(234,179,8,.10);  border-color:rgba(234,179,8,.30);  color:#fde047; }
.gl-badge.cat-distribution{background:rgba(0,180,216,.10);  border-color:rgba(0,180,216,.35);  color:var(--cyan-300); }
.gl-badge.cat-credit{      background:rgba(217,70,239,.10); border-color:rgba(217,70,239,.30); color:#f0abfc; }
.gl-badge.cat-tech{        background:rgba(148,163,184,.10);border-color:rgba(148,163,184,.25);color:#cbd5e1; }

.gl-abbrev{
  display:inline-block;
  font-family:var(--mono);
  font-size:11.5px;
  font-weight:500;
  color:var(--cyan-300);
  background:rgba(0,180,216,.08);
  border:1px solid rgba(0,180,216,.22);
  padding:1px 8px;
  border-radius:3px;
  letter-spacing:.04em;
}

.gl-entry p{
  margin:0;
  color:var(--ink-2);
  line-height:1.65;
  font-size:14.5px;
}

.gl-entry[hidden]{display:none}
.gl-letter-group[hidden]{display:none}

/* ===== Empty state ===== */
.gl-empty{
  text-align:center;
  padding:64px 16px;
  color:var(--muted);
  font-size:15px;
  border:1px dashed var(--bd);
  border-radius:4px;
  margin-top:24px;
}
.gl-empty:not([hidden]){display:block}
.gl-empty[hidden]{display:none}

/* ===== Mobile ===== */
@media (max-width:720px){
  .gl-alpha-inner{gap:2px 4px}
  .gl-alpha a{min-width:26px; height:26px; font-size:11.5px; padding:0 5px}
  .gl-filter{gap:6px}
  .gl-chip{padding:5px 12px; font-size:12px}
  .gl-letter-group h2{font-size:1.55rem}
  .gl-entry{padding:18px 4px}
  .gl-entry h3{font-size:1rem}
}