/* The one Light Lounge footer's styling. The markup is functions/_lib/site-footer.js; a page carries a marker pair
   (or a template calls the module) and the footer, with links to this file and to tokens.css, is written there.
   It depends on nothing but tokens.css (colours are tokens, never literals), so it renders the same on a page that
   loads ll.css and on a bare page that loads nothing else. */

.sfoot{position:relative;z-index:2;box-sizing:border-box;margin:0;padding:64px 0 76px;background:var(--ll-marquee-ground);border-top:1px solid var(--ll-marquee-line);color:var(--ll-marquee-label);font:13px/1.6 Inter,system-ui,-apple-system,"Segoe UI",sans-serif;text-align:left}
.sfoot *,.sfoot *::before,.sfoot *::after{box-sizing:border-box}
.sfoot .wrap{max-width:1200px;margin:0 auto;padding:0 32px}
.sfoot .fgrid{display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr;gap:36px;margin:0 0 44px}
.sfoot .fgrid h4{margin:0 0 16px;font:600 11px/1.4 Inter,system-ui,-apple-system,"Segoe UI",sans-serif;text-transform:uppercase;letter-spacing:.14em;color:var(--ll-marquee-ink-soft)}
.sfoot .fgrid a{display:block;padding:6px 0;color:var(--ll-marquee-label);text-decoration:none}
.sfoot .fgrid a:hover{color:var(--ll-marquee-gold)}
.sfoot .fbrand{display:flex;align-items:center;gap:11px;margin:0 0 14px;font:400 24px/1.2 Fraunces,Georgia,serif;color:var(--ll-marquee-ink)}
.sfoot .fbrand .dot{display:inline-block;flex:none;width:13px;height:13px;border-radius:50%;background:radial-gradient(circle at 32% 30%,var(--ll-marquee-pod-ember),var(--ll-marquee-flare) 52%,var(--ll-marquee-blush));box-shadow:0 0 20px var(--ll-marquee-glow)}
.sfoot .sf-tag{max-width:280px;margin:0 0 16px}
.sfoot .addr{margin:0;font-size:14px;line-height:1.7;color:var(--ll-marquee-ink-soft)}
.sfoot .addr strong{color:var(--ll-marquee-ink);font-weight:600}
.sfoot .fgrid .addr a{display:inline;padding:0;color:var(--ll-marquee-gold);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.sfoot .fgrid .addr a:hover{color:var(--ll-marquee-ink)}

/* Fine print: a page's own line (a pricing or availability disclaimer) or the workshop's approved disclaimers. */
.sfoot .sf-notes{display:grid;gap:12px;margin:0 0 40px;max-width:72ch}
.sfoot .fine p{margin:0 0 8px;font-size:13px;line-height:1.6;color:var(--ll-marquee-label)}

/* The bottom 76px of the footer is left clear for the site's floating "Ask us" and back-to-top buttons and a landing
   page's sticky bar, so none of them covers the legal bar or the credit. */

/* The legal bar: accessibility, privacy, terms and the operator line. */
.sfoot .sf-legal{padding:14px 18px;background:var(--ll-marquee-card-2);color:var(--ll-marquee-ink-soft);font-size:13px;line-height:1.6;text-align:center}
.sfoot .sf-legal a{color:var(--ll-marquee-ink);font-weight:600;text-decoration:none}
.sfoot .sf-legal a:hover{color:var(--ll-marquee-gold)}
.sfoot .sf-legal .legal{margin-top:6px;font-size:12px}

/* SNRG credit: SNRG Consulting, Inc. is the merchant of record for the workshop deposit and its name is on the
   card statement, so every footer ends with SNRG's own small logo and a "Who is SNRG?" link to snrg.me. The logo
   is the site's own /assets/snrg-logo.png, an opaque tile that snrg.me shows with rounded corners (no other
   origin). Colours are tokens; the link is 44px tall to tap. */
.snrg-credit{display:flex;justify-content:center;margin:0;font-size:13px}
.snrg-credit a{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 10px}
.snrg-credit img{display:block;flex:none;width:28px;height:28px;border-radius:6px}
.snrg-credit span{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.sfoot .snrg-credit{padding:0 18px 12px;background:var(--ll-marquee-card-2)}
.sfoot .snrg-credit a{color:var(--ll-marquee-ink-soft)}
.sfoot .snrg-credit a:hover{color:var(--ll-marquee-gold)}

@media (max-width:760px){
  .sfoot{padding-top:48px}
  .sfoot .fgrid{grid-template-columns:1fr 1fr;gap:28px 20px}
  .sfoot .sf-brand{grid-column:1/-1}
}
@media (max-width:440px){
  .sfoot .wrap{padding:0 20px}
}
@media (max-width:330px){
  .sfoot .fgrid{grid-template-columns:1fr}
}
