/* ============================================================
   CITY GIRLS ACADEMY: the footer every page carries
   (Cyrus, 2026-09-25: "on the footer of every single page, we need
   trust icons, money icons, disclaimers everywhere").
   Markup: site_footer.py, the one place it is written. This sheet is
   linked from inside the footer itself, so any page that carries the
   footer is styled by it, whatever else that page loads. Everything is
   scoped to .cga-foot and brings its own tokens, because the footer sits
   on pages built three different ways (theme.css, tool.css + course.css,
   and the self-contained /begin/).
   Black and white, one purple: the glyphs inside the seals.
   ============================================================ */
.cga-foot{
  --f-ink:#0B0B0B;
  --f-on:#FBFAF9;
  --f-muted:rgba(251,250,249,.72);   /* 9.9:1 on ink */
  --f-faint:rgba(251,250,249,.62);   /* 7.4:1 on ink */
  --f-line:rgba(251,250,249,.16);
  --f-violet:#C4B5FD;                /* 10.7:1 on ink */
  display:block;background:var(--f-ink);color:var(--f-muted);
  font-family:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:15px;line-height:1.6;font-weight:400;text-align:left;
  padding:96px 0 48px;margin:0;border:0;
}
.cga-foot *,.cga-foot *::before,.cga-foot *::after{box-sizing:border-box}
.cga-foot-in{max-width:1180px;margin:0 auto;padding:0 32px}
.cga-foot p{margin:0}
.cga-foot a{color:var(--f-muted);text-decoration:none;transition:color .12s ease-out}
.cga-foot a:hover{color:var(--f-on)}
.cga-foot a:focus-visible{outline:2px solid var(--f-violet);outline-offset:3px;border-radius:4px}

/* the landing pages open on the mark instead of the site's columns */
.cga-foot--lp{padding:64px 0 40px}
.cga-foot img.cga-foot-mark{display:block;width:150px;max-width:50%;height:auto;margin:0 0 24px;opacity:.95}

/* ---------- the trust and money marks ---------- */
.cga-marks{list-style:none;margin:0;padding:32px 0;display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;
  border-bottom:1px solid var(--f-line)}
.cga-foot--lp .cga-marks{border-top:1px solid var(--f-line)}
.cga-marks li{display:flex;align-items:center;gap:12px;min-width:0;margin:0;padding:0}
.cga-marks li::before{content:none}
.cga-marks a{display:flex;align-items:center;gap:12px;min-width:0;color:inherit}
.cga-seal{flex:0 0 auto;width:48px;height:48px;color:var(--f-on);display:block}
.cga-seal .g{color:var(--f-violet)}
.cga-marks b{display:block;color:var(--f-on);font-size:14.5px;font-weight:700;
  letter-spacing:.02em;line-height:1.3}
.cga-marks small{display:block;font-size:13px;color:var(--f-muted);line-height:1.4;margin-top:2px}
.cga-marks a small{text-decoration:underline;text-decoration-color:rgba(196,181,253,.55);text-underline-offset:3px}
.cga-marks a:hover small,.cga-marks a:focus-visible small{color:var(--f-on);text-decoration-color:currentColor}

/* ---------- talk to someone ---------- */
.cga-talk{display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:32px 0;border-bottom:1px solid var(--f-line)}
.cga-talk p{max-width:62ch;color:var(--f-muted);font-size:15px;line-height:1.55}
.cga-talk p b{color:var(--f-on);font-weight:700}
.cga-foot a.cga-talk-btn{
  flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:12px;
  min-height:52px;padding:14px 24px;border-radius:999px;
  border:1.5px solid rgba(251,250,249,.62);color:var(--f-on);
  font-size:15.5px;font-weight:700;letter-spacing:.03em;line-height:1.2;
  transition:background .13s ease-out,border-color .13s ease-out,color .13s ease-out,transform .13s ease-out}
.cga-talk-btn svg{flex:0 0 auto;color:var(--f-violet);transition:transform .13s ease-out,color .13s ease-out}
.cga-foot a.cga-talk-btn:hover{background:#6D28D9;border-color:#6D28D9;color:#fff;transform:translateY(-1px)}
.cga-talk-btn:hover svg{color:#fff;transform:translateX(3px)}

/* ---------- disclaimers ---------- */
.cga-disc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 48px;
  padding:32px 0;font-size:13px;line-height:1.6;color:var(--f-faint)}
.cga-disc p b{color:var(--f-on);font-weight:700}

/* ---------- the last line ---------- */
.cga-legal{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;
  padding-top:24px;border-top:1px solid var(--f-line);font-size:13px;color:var(--f-faint)}
.cga-legal a{color:var(--f-muted);text-decoration:underline;text-decoration-color:rgba(251,250,249,.3);
  text-underline-offset:3px}
.cga-legal a:hover{text-decoration-color:currentColor}
.cga-legal .sep{opacity:.5}

/* ---------- phones ---------- */
@media(max-width:900px){
  .cga-marks{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}
  .cga-disc{grid-template-columns:1fr;gap:16px}
}
@media(max-width:760px){
  .cga-foot{padding:64px 0 40px}
  .cga-foot--lp{padding:48px 0 32px}
  .cga-foot-in{padding:0 20px}
  .cga-marks{padding:24px 0}
  .cga-marks li,.cga-marks a{gap:10px}
  .cga-seal{width:40px;height:40px}
  .cga-marks b{font-size:14px}
  .cga-marks small{font-size:12.5px}
  .cga-talk{flex-direction:column;align-items:stretch;gap:16px;padding:24px 0}
  .cga-foot a.cga-talk-btn{width:100%;min-height:56px}
  .cga-disc{padding:24px 0}
  .cga-legal{gap:8px 20px}
  .cga-legal .sep{display:none}          /* the dots dangled at the ends of wrapped lines */
}
@media(max-width:400px){
  .cga-foot-in{padding:0 16px}
}
@media(prefers-reduced-motion:reduce){
  .cga-foot *{transition:none!important}
}