/* Home: featured-institutions strip (resources/views/home/strip.blade.php). Prefix agh-strip-.
   Slim band on --ag-bg with hairlines; two marquee rows (ag-marquee, opposite directions) that pause on
   hover / keyboard focus; edge-fade masks. Reduced motion: one static, horizontally scrollable row. */
.agh-strip {
  position: relative;
  padding: 11px 0;
  background: var(--ag-bg);
  border-top: 1px solid var(--ag-line);
  border-bottom: 1px solid var(--ag-line);
  overflow: clip;
}
/* faint brand wash so the band reads as a distinct, calm surface */
.agh-strip::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(60% 140% at 0% 50%, var(--ag-brand-soft), transparent 70%),
    radial-gradient(40% 120% at 100% 50%, var(--ag-glow), transparent 75%);
  opacity: .55;
}
.agh-strip-inner { position: relative; display: flex; align-items: center; gap: 28px; }

/* ---------- Label ---------- */
.agh-strip-label {
  flex: 0 0 auto; display: flex; align-items: center; gap: 12px;
  padding-right: 28px; border-right: 1px solid var(--ag-line);
}
.agh-strip-label-icon {
  width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; flex: 0 0 auto;
  background: var(--ag-grad); color: #fff; font-size: 1.1rem;
  box-shadow: 0 8px 20px var(--ag-glow);
}
.agh-strip-label-text { display: flex; flex-direction: column; line-height: 1.25; }
.agh-strip-kicker {
  font-size: .68rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ag-brand);
}
.agh-strip-title { font-size: .98rem; font-weight: 600; color: var(--ag-ink); white-space: nowrap; }

/* ---------- Marquee rows ---------- */
.agh-strip-rows { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.agh-strip-viewport {
  position: relative; overflow: hidden; padding: 7px 0;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
}
.agh-strip-track {
  display: flex; width: max-content;
  animation: ag-marquee var(--agh-strip-dur, 52s) linear infinite;
  will-change: transform;
}
.agh-strip-viewport-rev .agh-strip-track { animation-duration: calc(var(--agh-strip-dur, 52s) * 1.12); animation-direction: reverse; }
.agh-strip-viewport:hover .agh-strip-track,
.agh-strip-viewport:focus-within .agh-strip-track { animation-play-state: paused; }

/* The trailing padding equals the item gap, so -50% lands exactly on the second copy (seamless loop). */
.agh-strip-list { display: flex; gap: 10px; margin: 0; padding: 0 10px 0 0; list-style: none; }
.agh-strip-item { flex: 0 0 auto; margin: 0; padding: 0; }

/* ---------- Pills ---------- */
.agh-strip .agh-strip-link {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 5px 16px 5px 5px; border-radius: 999px;
  background: linear-gradient(180deg, var(--ag-surface), var(--ag-surface-2));
  border: 1px solid var(--ag-line);
  color: var(--ag-ink); text-decoration: none; white-space: nowrap;
  font-family: var(--ag-font); font-size: .875rem; font-weight: 500; line-height: 1.2;
  box-shadow: 0 1px 2px rgba(2, 44, 34, .05);
  transition: transform .35s var(--ag-ease), box-shadow .35s var(--ag-ease), border-color .3s, color .3s;
}
.agh-strip .agh-strip-link:hover {
  color: var(--ag-brand);
  border-color: color-mix(in srgb, var(--ag-brand) 45%, var(--ag-line));
  transform: translateY(-3px);
  box-shadow: 0 8px 16px -6px var(--ag-glow), 0 2px 6px var(--ag-glow);
}
.agh-strip .agh-strip-link:focus-visible { outline: 2px solid var(--ag-brand-mid); outline-offset: 2px; color: var(--ag-brand); }
.agh-strip-icon {
  width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; flex: 0 0 auto;
  background: var(--ag-brand-soft); color: var(--ag-brand); font-size: .85rem;
  transition: background-color .3s, color .3s, transform .45s var(--ag-ease);
}
.agh-strip-link:hover .agh-strip-icon,
.agh-strip-link:focus-visible .agh-strip-icon { background: var(--ag-brand); color: var(--ag-on-brand); transform: rotate(-10deg) scale(1.06); }
/* city: a small location icon, no separator mark */
.agh-strip-city {
  display: inline-flex; align-items: center; gap: 4px;
  color: var(--ag-muted); font-size: .78rem; font-weight: 400;
}
.agh-strip-city .bi { font-size: .72rem; line-height: 1; color: var(--ag-brand); opacity: .7; transition: opacity .3s; }
.agh-strip-link:hover .agh-strip-city .bi,
.agh-strip-link:focus-visible .agh-strip-city .bi { opacity: 1; }

html[data-theme="dark"] .agh-strip::before { opacity: .7; }
html[data-theme="dark"] .agh-strip .agh-strip-link { box-shadow: 0 1px 2px rgba(0, 0, 0, .3); }
html[data-theme="dark"] .agh-strip .agh-strip-link:hover { box-shadow: 0 8px 16px -6px rgba(0, 0, 0, .55), 0 0 0 1px var(--ag-glow); }

/* ---------- Responsive ---------- */
@media (max-width: 991.98px) {
  .agh-strip-inner { gap: 20px; }
  .agh-strip-label { padding-right: 20px; }
  .agh-strip-label-icon { display: none; }
}
@media (max-width: 767.98px) {
  .agh-strip { padding: 14px 0 12px; }
  .agh-strip-inner { flex-direction: column; align-items: stretch; gap: 8px; }
  .agh-strip-label { justify-content: center; padding-right: 0; border-right: 0; }
  .agh-strip-label-text { flex-direction: row; align-items: baseline; gap: 8px; }
  .agh-strip-kicker { display: none; }
  .agh-strip-title { font-size: .9rem; }
  .agh-strip-viewport-rev { display: none; }
  .agh-strip-viewport {
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
  }
  .agh-strip-track { animation-duration: calc(var(--agh-strip-dur, 52s) * .85); }
}

/* ---------- Reduced motion: a single static row the visitor can scroll ---------- */
@media (prefers-reduced-motion: reduce) {
  .agh-strip-track { animation: none !important; transform: none; will-change: auto; }
  .agh-strip-viewport-rev, .agh-strip-list-dup { display: none; }
  .agh-strip-viewport {
    overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin;
    -webkit-mask-image: none; mask-image: none;
  }
  .agh-strip .agh-strip-link, .agh-strip-icon, .agh-strip-city .bi { transition: none; }
  .agh-strip .agh-strip-link:hover { transform: none; }
}