/* glow.css — the warm light of the two hubs (One mind v1.4, Pantheon v1.3). Keep identical in both folders.
   CSS only: gold and turquoise halos on cards and the main action, a glowing root line on each card, the
   "Plan a visit" pill in the HUD, the reassurance note and the seven-site footer. Still under reduced motion. */
:root { --glow-gold: 255, 194, 61; --glow-turq: 47, 214, 224; --earth: #3d2410; --leaf: #5f8a3a; }

/* soft halo around every chapter card: a turquoise breath behind the island, gold close to it */
.card { position: relative; box-shadow: 0 18px 60px rgba(0, 0, 0, .35), 0 0 0 1px rgba(255, 255, 255, .5), 0 0 42px -6px rgba(var(--glow-turq), .32), 0 0 90px -20px rgba(var(--glow-gold), .3); }
/* the root line: earth, gold and leaf along the top edge of each card, a light travelling along it */
.card::before { content: ""; position: absolute; left: 22px; right: 22px; top: 0; height: 3px; border-radius: 0 0 3px 3px; pointer-events: none;
  background: linear-gradient(90deg, rgba(61, 36, 16, 0), #8a5a2e 12%, #ffc23d 40%, #2fd6e0 60%, #5f8a3a 88%, rgba(95, 138, 58, 0));
  background-size: 200% 100%; animation: glow-root 9s linear infinite; opacity: .9; }
@keyframes glow-root { to { background-position: -200% 0; } }

/* the main action: a gold button that glows */
.btn { box-shadow: 0 0 0 1px rgba(122, 90, 0, .25), 0 6px 22px -6px rgba(var(--glow-gold), .9), 0 0 28px -4px rgba(var(--glow-gold), .55); transition: box-shadow .25s, transform .25s, background .2s; }
.btn:hover { transform: translateY(-1px); box-shadow: 0 0 0 1px rgba(122, 90, 0, .35), 0 8px 26px -6px rgba(var(--glow-gold), 1), 0 0 44px -2px rgba(var(--glow-gold), .7); }
.btn.btn-visit { background: linear-gradient(180deg, #ffd56a, #ffc23d); color: #1d1300; animation: glow-breathe 4.2s ease-in-out infinite; }
.btn.btn-visit:hover { background: linear-gradient(180deg, #ffe08a, #ffcb52); }
@keyframes glow-breathe { 50% { box-shadow: 0 0 0 1px rgba(122, 90, 0, .3), 0 8px 30px -6px rgba(var(--glow-gold), 1), 0 0 56px 0 rgba(var(--glow-gold), .6); } }

/* "Plan a visit" in the HUD: reachable from every chapter */
.hud-visit { white-space: nowrap; background: linear-gradient(180deg, #ffd56a, #ffc23d); color: #1d1300; font-weight: 700;
  box-shadow: 0 0 0 1px rgba(122, 90, 0, .3), 0 0 24px -2px rgba(var(--glow-gold), .75); }
.hud-visit:hover { background: linear-gradient(180deg, #ffe08a, #ffcb52); }
.hud-visit:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }

/* what happens after you write */
.after-note { display: flex; gap: 10px; align-items: flex-start; background: #fff; border-radius: 14px; padding: 10px 14px; margin: 10px 0 4px !important;
  font-size: 14.5px; color: var(--ink) !important; box-shadow: inset 4px 0 0 #2fd6e0; }
.after-note b { white-space: nowrap; }

/* a visit, step by step: a timeline with a glowing root running down it */
.timeline { list-style: none; margin: 0 0 8px; padding: 0 0 0 26px; display: grid; gap: 8px; position: relative; }
.timeline::before { content: ""; position: absolute; left: 9px; top: 6px; bottom: 6px; width: 3px; border-radius: 3px;
  background: linear-gradient(180deg, #8a5a2e, #ffc23d 35%, #2fd6e0 70%, #5f8a3a); box-shadow: 0 0 12px rgba(var(--glow-gold), .55); }
.timeline li { position: relative; background: #fff; border-radius: 14px; padding: 10px 14px; font-size: 15px; color: var(--ink-2); }
.timeline li::before { content: ""; position: absolute; left: -22px; top: 15px; width: 11px; height: 11px; border-radius: 50%; background: #ffc23d;
  box-shadow: 0 0 0 3px #fff, 0 0 14px 2px rgba(var(--glow-gold), .9); }
.timeline li b { display: block; color: var(--ink); font-size: 15.5px; }
.timeline .when { font: 700 12px var(--mono); text-transform: uppercase; letter-spacing: .04em; color: #6b4423; }

/* what we will not do */
.wont { list-style: none; margin: 0 0 8px; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 6px 16px; background: #fff; border-radius: 14px; padding: 12px 16px; }
.wont li { position: relative; padding-left: 20px; font-size: 14.5px; color: var(--ink-2); }
.wont li::before { content: "✕"; position: absolute; left: 0; top: 0; font-weight: 700; color: #a3134f; }
.wont li b { color: var(--ink); }

/* the seven websites, at the end of the page */
.site-foot { margin: 14px 0 0; padding: 12px 0 0; border-top: 2px solid rgba(21, 17, 43, .12); font-size: 13.5px; color: var(--ink); }
.site-foot p { margin: 0 0 6px !important; color: var(--ink) !important; }
.site-foot ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.site-foot a { display: inline-block; color: var(--ink); text-decoration: none; background: #fff; border-radius: 999px; padding: 4px 11px; font-weight: 600; }
.site-foot a:hover { box-shadow: inset 0 0 0 2px var(--ink); }
.site-foot a:focus-visible { outline: 3px solid #b8860b; outline-offset: 2px; }
.site-foot a[aria-current] { background: var(--ink); color: #fff; }

@media (max-width: 760px) {
  .wont { grid-template-columns: 1fr; }
  .hud-visit { padding: 8px 13px; }
  .hud-right { gap: 6px; }
}
@media (max-width: 420px) { .hud-chapter { display: none; } }
@media (prefers-reduced-motion: reduce) {
  .card::before, .btn.btn-visit { animation: none; }
  .btn:hover { transform: none; }
}