/* Glass look: liquid-glass footer + glassy menu items. Loaded after pill-nav.css on every page. */

/* ---------- Menu items: richer glass + sliding-chip hover ---------- */
.pill-nav {
  background: rgba(255,255,255,0.58);
  -webkit-backdrop-filter: blur(18px) saturate(170%); backdrop-filter: blur(18px) saturate(170%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9), inset 0 -1px 0 rgba(15,77,46,0.06), 0 8px 28px rgba(15,77,46,0.16);
}
.pill-links { gap: 2px; }
.pill-links a {
  padding: 7px 13px; border-radius: 999px;
  transition: color .2s, background .25s, box-shadow .25s, transform .25s;
}
.pill-links a:hover {
  background: rgba(255,255,255,0.78);
  box-shadow: inset 0 1px 0 #fff, 0 3px 10px rgba(15,77,46,0.14);
  transform: translateY(-1px);
}
.pill-links a.active { background: rgba(15,77,46,0.09); box-shadow: inset 0 1px 0 rgba(255,255,255,0.8); }
@media (max-width: 860px) {
  .pill-links { gap: 0; background: rgba(255,255,255,0.96); -webkit-backdrop-filter: blur(20px) saturate(170%); backdrop-filter: blur(20px) saturate(170%); }
  .pill-links a { border-radius: 12px; padding: 13px 12px; }
  .pill-links a:hover { transform: none; }
}

/* ---------- Liquid-glass footer ---------- */
.gfoot {
  position: relative; overflow: hidden; isolation: isolate; color: #fff;
  padding: 72px 0 0;
  background: linear-gradient(160deg, #0a3b24 0%, #0F4D2E 45%, #0b3d26 100%);
}
/* drifting colour blobs: cheap radial gradients, no blur filters */
.gfoot-bg { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.gfoot-bg i { position: absolute; border-radius: 50%; will-change: transform; }
.gfoot-bg i:nth-child(1) { width: 640px; height: 640px; left: -140px; top: -120px; background: radial-gradient(circle, rgba(76,154,91,0.75) 0%, rgba(76,154,91,0) 68%); animation: gf-a 22s ease-in-out infinite alternate; }
.gfoot-bg i:nth-child(2) { width: 560px; height: 560px; right: -120px; top: 30px; background: radial-gradient(circle, rgba(201,162,75,0.55) 0%, rgba(201,162,75,0) 68%); animation: gf-b 26s ease-in-out infinite alternate; }
.gfoot-bg i:nth-child(3) { width: 720px; height: 720px; left: 28%; bottom: -380px; background: radial-gradient(circle, rgba(220,235,221,0.5) 0%, rgba(220,235,221,0) 66%); animation: gf-c 30s ease-in-out infinite alternate; }
@keyframes gf-a { to { transform: translate(160px, 90px) scale(1.12); } }
@keyframes gf-b { to { transform: translate(-190px, 70px) scale(0.92); } }
@keyframes gf-c { to { transform: translate(-220px, -60px) scale(1.1); } }

.gfoot-card {
  position: relative; display: grid; grid-template-columns: 1.05fr 2fr; gap: 40px;
  padding: 38px 42px 26px; border-radius: 30px;
  background: linear-gradient(135deg, rgba(255,255,255,0.20) 0%, rgba(255,255,255,0.07) 55%, rgba(255,255,255,0.13) 100%);
  -webkit-backdrop-filter: blur(22px) saturate(160%); backdrop-filter: blur(22px) saturate(160%);
  border: 1px solid rgba(255,255,255,0.30);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.55), inset 0 -1px 0 rgba(255,255,255,0.10), 0 24px 60px rgba(0,0,0,0.28);
}
/* wobbly "liquid" rim light along the edge (static SVG displacement; purely decorative) */
.gfoot-card::before {
  content: ''; position: absolute; inset: -1px; border-radius: 30px; pointer-events: none;
  border: 2px solid rgba(255,255,255,0.28);
  -webkit-mask: linear-gradient(135deg, #000 0%, transparent 45%, transparent 70%, #000 100%); mask: linear-gradient(135deg, #000 0%, transparent 45%, transparent 70%, #000 100%);
  filter: url(#ankx-liquid);
}
.gfoot-brand { display: flex; align-items: center; gap: 12px; font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 26px; color: #fff; text-decoration: none; }
.gfoot-brand img { width: 40px; height: 40px; background: rgba(255,255,255,0.9); border-radius: 50%; padding: 3px; }
.gfoot-tag { margin: 8px 0 0; font-family: 'Poppins', sans-serif; font-weight: 500; font-size: 14px; color: #E7CE8E; letter-spacing: .03em; }
.gfoot-blurb { margin: 16px 0 22px; font-size: 14.5px; line-height: 1.6; color: rgba(255,255,255,0.86); max-width: 340px; }
.gfoot-cta {
  display: inline-block; font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 14px; text-decoration: none;
  color: #0F4D2E; background: rgba(255,255,255,0.92); padding: 11px 22px; border-radius: 999px;
  box-shadow: inset 0 1px 0 #fff, 0 8px 22px rgba(0,0,0,0.22); transition: transform .2s, box-shadow .2s;
}
.gfoot-cta:hover { transform: translateY(-2px); box-shadow: inset 0 1px 0 #fff, 0 12px 28px rgba(0,0,0,0.28); }

.gfoot-cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.gfoot-col h4 { margin: 0 0 12px; font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,0.62); }
.gfoot-col a {
  display: block; width: fit-content; margin: 0 0 3px -10px; padding: 6px 10px; border-radius: 999px;
  font-size: 14px; color: rgba(255,255,255,0.92); text-decoration: none;
  transition: background .25s, box-shadow .25s, color .2s, transform .25s;
}
.gfoot-col a:hover, .gfoot-col a:focus-visible {
  color: #fff; background: rgba(255,255,255,0.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.45), 0 4px 12px rgba(0,0,0,0.18); transform: translateX(3px); outline: none;
}
.gfoot-bottom {
  grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  margin-top: 8px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,0.18);
  font-size: 12.5px; color: rgba(255,255,255,0.7);
}

/* the big glassy wordmark, cropped at the bottom like the reference */
.gfoot-word {
  --w: min(19.5vw, 276px);
  position: relative; text-align: center; user-select: none; pointer-events: none;
  margin-top: 24px; height: calc(var(--w) * 0.98); overflow: hidden;
  font-family: 'Poppins', sans-serif; font-weight: 800; letter-spacing: -0.03em; line-height: 1;
  font-size: var(--w); white-space: nowrap;
}
.gfoot-word span {
  display: block; transform: translateY(-3%);
  background: linear-gradient(180deg, rgba(255,255,255,0.65) 0%, rgba(255,255,255,0.22) 55%, rgba(255,255,255,0.04) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  -webkit-text-stroke: 1.5px rgba(255,255,255,0.42);
}

@media (max-width: 900px) {
  .gfoot { padding-top: 56px; }
  .gfoot-card { grid-template-columns: 1fr; gap: 28px; padding: 30px 24px 22px; border-radius: 24px; -webkit-backdrop-filter: blur(14px) saturate(150%); backdrop-filter: blur(14px) saturate(150%); }
  .gfoot-card::before { border-radius: 24px; }
  .gfoot-cols { grid-template-columns: repeat(2, 1fr); }
  .gfoot-blurb { max-width: none; }
}
@media (max-width: 460px) { .gfoot-cols { gap: 16px; } .gfoot-col a { font-size: 13.5px; } }
@media (prefers-reduced-motion: reduce) { .gfoot-bg i { animation: none; } .pill-links a, .gfoot-col a { transition: none; } }
