@font-face { font-family: 'CaveatTG'; src: url('/thegiving_ai/caveat.ttf') format('truetype'); font-weight: 400 700; font-display: swap; }
html { scroll-behavior: smooth; }
/* v23 GREEN-PRIMARY palette (purple->accent only) + green tree
The Giving AI - homepage (website 52, thegiving.ai) v6 */
/* Scoped via .tg-page wrapper. WCAG AA. Accent: Paul Dolphin purple #7F46ED. Apple green for organic warmth. */

.tg-page {
  --tg-purple: #7F46ED;
  --tg-purple-dark: #5b2bbf;
  --tg-green: #3f9d3a;
  --tg-green-dark: #256b22;
  --tg-green-soft: #cdeccb;
  --tg-ink: #1a1530;
  --tg-body: #3a3550;
  --tg-muted: #5d5870;
  --tg-bg: #ffffff;
  --tg-bg-soft: #f6f3fe;
  --tg-border: #e3dcf6;
  --tg-maxw: 1080px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--tg-body);
  background: var(--tg-bg);
  line-height: 1.62;
  -webkit-font-smoothing: antialiased;
}
.tg-page *, .tg-page *::before, .tg-page *::after { box-sizing: border-box; }
.tg-page p { margin: 0 0 1rem; }
.tg-page a { color: var(--tg-green-dark); }
.tg-page strong { font-weight: 700; color: var(--tg-ink); }
.tg-wrap { max-width: var(--tg-maxw); margin: 0 auto; padding: 0 1.5rem; }

.tg-skip { position: absolute; left: -9999px; top: 0; background: var(--tg-green-dark); color: #ffffff; padding: 0.6rem 1rem; border-radius: 0 0 6px 0; z-index: 100; }
.tg-skip:focus { left: 0; }

/* HEADER */
.tg-header { position: absolute; top: 0; left: 0; right: 0; z-index: 20; background: transparent; padding: 1.2rem 0; }
.tg-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.tg-brand { font-size: 1.2rem; font-weight: 800; letter-spacing: 0.01em; color: var(--tg-ink); }
.tg-brand .tg-dot { color: #D6453C; }
.tg-nav { display: flex; gap: 1.3rem; flex-wrap: wrap; }
.tg-nav a { color: var(--tg-body); text-decoration: none; font-size: 0.95rem; font-weight: 600; }
.tg-nav a:hover, .tg-nav a:focus { color: var(--tg-green-dark); text-decoration: underline; }

/* HERO - real 2-col, tree on a green blob, no dead space */
.tg-hero { min-height: 100vh; display: flex; align-items: center; padding: 6rem 0 3rem; background: radial-gradient(70% 90% at 72% 42%, rgba(255,255,255,0.92) 0%, rgba(255,255,255,0.0) 58%), linear-gradient(160deg, #def5d7 0%, #c4ecbd 100%); }
.tg-hero .tg-wrap { width: 100%; }
.tg-hero-grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: 2rem; align-items: center; }
.tg-hero-copy { min-width: 0; }
.tg-eyebrow { display: inline-block; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--tg-green-dark); border: 1px solid var(--tg-border); border-radius: 999px; padding: 0.35rem 0.9rem; margin-bottom: 1.3rem; }
.tg-hero h1 { font-size: clamp(2.1rem, 5vw, 3.2rem); line-height: 1.1; font-weight: 800; color: var(--tg-ink); margin: 0 0 1.1rem; }
.tg-hero .tg-lead { font-size: clamp(1.08rem, 2.1vw, 1.3rem); color: var(--tg-body); margin: 0 0 1.9rem; }
.tg-hero-art { position: relative; display: flex; align-items: flex-end; justify-content: center; min-height: 100vh; }
.tg-hero-art::before { content: none; }
.tg-hero-art img { position: relative; z-index: 1; height: min(94vh, 820px); width: auto; max-width: none; }
@media (max-width: 800px) { .tg-hero-grid { grid-template-columns: 1fr; gap: 1.5rem; } .tg-hero-art { min-height: 260px; } }

/* BUTTONS */
.tg-btn { display: inline-block; font-weight: 700; font-size: 1.0rem; text-decoration: none; padding: 0.85rem 1.6rem; border-radius: 8px; border: 2px solid var(--tg-green-dark); cursor: pointer; transition: background 0.16s, color 0.16s, transform 0.16s; }
.tg-btn-primary { background: var(--tg-green-dark); color: #ffffff; border-color: var(--tg-green-dark); }
.tg-btn-primary:hover, .tg-btn-primary:focus { background: #45209c; border-color: #45209c; color: #ffffff; }
.tg-btn-ghost { background: transparent; color: var(--tg-green-dark); }
.tg-btn-ghost:hover, .tg-btn-ghost:focus { background: var(--tg-bg-soft); }
.tg-btn-row { display: flex; gap: 0.9rem; flex-wrap: wrap; align-items: center; }
.tg-btn:focus-visible { outline: 3px solid var(--tg-green-dark); outline-offset: 2px; }

/* SECTION SCAFFOLD */
.tg-section { padding: 2.6rem 0; }
.tg-section-alt { background: var(--tg-bg-soft); border-top: 1px solid var(--tg-border); border-bottom: 1px solid var(--tg-border); }
.tg-section h2 { font-size: clamp(1.55rem, 3.2vw, 2.15rem); font-weight: 800; color: var(--tg-ink); margin: 0 0 0.8rem; }
.tg-section .tg-section-intro { font-size: 1.14rem; color: var(--tg-body); max-width: 62ch; margin: 0 0 1.6rem; }
.tg-kicker { font-size: 0.78rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--tg-green-dark); margin: 0 0 0.7rem; }

/* decorative hand-drawn underline accent on h2 */
.tg-squiggle, .tg-squiggle-green { position: relative; display: inline-block; }
.tg-squiggle::after, .tg-squiggle-green::after { content: ""; display: block; width: 72px; height: 5px; border-radius: 3px; margin-top: 8px; }
.tg-squiggle::after { background: var(--tg-purple); }
.tg-squiggle-green::after { background: var(--tg-green); }

/* SECTION HEADER with apple art on the RIGHT of the H2 */
.tg-section-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; }
.tg-section-head-text { flex: 1 1 auto; min-width: 0; }
.tg-head-art { flex: 0 0 auto; width: 240px; align-self: center; }
.tg-head-art img { width: 100%; height: auto; display: block; }
@media (max-width: 720px) { .tg-head-art { display: none; } }

/* SPLIT (mission): text left, art right - fills the dead space */
.tg-split { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 2.2rem; align-items: center; overflow: visible; }
.tg-split-text { min-width: 0; }
.tg-split-art { display: flex; align-items: center; justify-content: center; }
.tg-split-art { position: relative; }
.tg-split-art img { width: min(150%, 520px); height: auto; margin: 0 -0.5rem 0 -4rem; max-width: none; }
@media (max-width: 760px) { .tg-split { grid-template-columns: 1fr; } .tg-split-art { display: none; } }

/* AUDIT CHECK GRID */
.tg-group-label { font-size: 1.18rem; font-weight: 800; color: var(--tg-ink); margin: 1.9rem 0 0.4rem; padding-left: 0.7rem; border-left: 4px solid var(--tg-green); }
.tg-checks { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; margin-top: 1rem; }
.tg-check { border: 1px solid var(--tg-border); border-left: 4px solid var(--tg-purple); border-radius: 8px; padding: 1.15rem 1.3rem; background: var(--tg-bg); }
.tg-check h3 { font-size: 1.05rem; font-weight: 700; color: var(--tg-ink); margin: 0 0 0.35rem; }
.tg-check p { font-size: 0.97rem; color: var(--tg-muted); margin: 0; }

/* CTA row (audit: two audiences) */
.tg-cta-row { display: flex; gap: 1rem; flex-wrap: wrap; margin-top: 2rem; }

/* QUARTERLY callout */
.tg-quarterly { margin-top: 2rem; padding: 1.4rem 1.6rem; border: 1px solid var(--tg-border); border-left: 4px solid var(--tg-green); border-radius: 10px; background: var(--tg-bg); }
.tg-quarterly-label { font-size: 0.8rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--tg-green-dark); margin: 0 0 0.5rem; }
.tg-quarterly p:last-child { margin: 0; font-size: 1.05rem; color: var(--tg-body); }

/* SERVICES - clean app-style cards, 3-up */
.tg-services { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.3rem; margin-top: 1.8rem; }
@media (min-width: 920px) { .tg-services { grid-template-columns: repeat(3, 1fr); } }
.tg-service { border: 1px solid var(--tg-border); border-radius: 12px; padding: 1.5rem; background: var(--tg-bg); transition: transform 0.16s, box-shadow 0.16s, border-color 0.16s; }
.tg-service:hover, .tg-service:focus-within { transform: translateY(-3px); box-shadow: 0 10px 26px rgba(127,70,237,0.12); border-color: var(--tg-purple); }
.tg-service .tg-num { display: flex; align-items: center; justify-content: center; width: 2.8rem; height: 2.8rem; border-radius: 50%; background: transparent; border: 2.5px solid var(--tg-green); color: #2c2a35; font-family: 'CaveatTG', cursive; font-weight: 700; font-size: 1.85rem; line-height: 1; padding: 0 0.14em 0.22em 0; margin-bottom: 0.8rem; box-sizing: border-box; }
.tg-service h3 { font-size: 1.16rem; font-weight: 800; color: var(--tg-ink); margin: 0 0 0.5rem; }
.tg-service p { font-size: 1.0rem; color: var(--tg-body); margin: 0; }

/* ICON WALL (apps + industries) - proper application tiles */
.tg-icat-label { font-size: 1.06rem; font-weight: 800; color: var(--tg-ink); margin: 1.7rem 0 0.7rem; }
.tg-iconwall { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 0.7rem; margin-bottom: 0.6rem; }
.tg-tile { display: flex; align-items: center; gap: 0.75rem; padding: 0.7rem 0.85rem; border: 1px solid var(--tg-border); border-radius: 10px; background: var(--tg-bg); transition: border-color 0.14s, box-shadow 0.14s; }
.tg-tile:hover { border-color: var(--tg-purple); box-shadow: 0 4px 14px rgba(127,70,237,0.10); }
.tg-tile span { font-size: 0.9rem; font-weight: 600; color: var(--tg-ink); line-height: 1.25; }
.tg-ic { width: 40px; height: 40px; flex: 0 0 auto; padding: 8px; border-radius: 9px; background: var(--tg-bg-soft); color: var(--tg-green-dark); }

/* MODEL STEPS */
.tg-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.2rem; margin-top: 1.8rem; }
.tg-step { border: 1px solid var(--tg-border); border-radius: 12px; padding: 1.5rem; background: var(--tg-bg); }
.tg-step .tg-step-label { font-size: 0.8rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--tg-green-dark); margin: 0 0 0.5rem; }
.tg-step h3 { font-size: 1.1rem; font-weight: 800; color: var(--tg-ink); margin: 0 0 0.45rem; }
.tg-step p { font-size: 0.98rem; color: var(--tg-body); margin: 0; }

/* WHY / FOUNDER */
.tg-why-grid { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 2.2rem; align-items: center; }
.tg-why-art { display: flex; align-items: center; justify-content: center; }
.tg-why-art img { width: min(100%, 300px); height: auto; }
.tg-why { min-width: 0; }
.tg-why p { font-size: 1.08rem; color: var(--tg-body); }
@media (max-width: 760px) { .tg-why-grid { grid-template-columns: 1fr; } .tg-why-art { display: none; } }

/* CONTACT FORM */
.tg-contact-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; align-items: start; }
@media (min-width: 760px) { .tg-contact-grid { grid-template-columns: 1fr 1fr; } }
.tg-form { border: 1px solid var(--tg-border); border-radius: 12px; padding: 1.8rem; background: var(--tg-bg); }
.tg-form .tg-field { margin-bottom: 1.1rem; }
.tg-form label { display: block; font-size: 0.92rem; font-weight: 700; color: var(--tg-ink); margin-bottom: 0.4rem; }
.tg-form input[type="text"], .tg-form input[type="email"], .tg-form textarea { width: 100%; padding: 0.75rem 0.9rem; font-size: 1rem; font-family: inherit; border: 1px solid var(--tg-border); border-radius: 7px; background: var(--tg-bg); color: var(--tg-ink); }
.tg-form input:focus, .tg-form textarea:focus { outline: 3px solid var(--tg-green-dark); outline-offset: 1px; border-color: var(--tg-green-dark); }
.tg-consent { display: flex; gap: 0.6rem; align-items: flex-start; font-size: 0.86rem; color: var(--tg-muted); margin-bottom: 1.2rem; }
.tg-consent input { margin-top: 0.25rem; }
.tg-form .tg-btn-primary { width: 100%; text-align: center; border: 0; }
.tg-contact-copy h2 { margin-top: 0; }
.tg-contact-copy ul { padding-left: 1.1rem; margin: 0 0 1.2rem; }
.tg-contact-copy li { margin-bottom: 0.5rem; color: var(--tg-body); }
.tg-mailto { font-weight: 700; }

/* FOOTER */
.tg-footer { border-top: 1px solid var(--tg-border); padding: 2.2rem 0; font-size: 0.9rem; color: var(--tg-muted); }
.tg-footer a { color: var(--tg-green-dark); text-decoration: none; }
.tg-footer a:hover { text-decoration: underline; }
.tg-footer p { margin: 0 0 0.4rem; }

@media (prefers-reduced-motion: reduce) { .tg-page * { transition: none; } }

/* ===== v7: app-store icon tiles, charcoal button, rebuilt footer ===== */

/* Charcoal button (secondary, high contrast vs purple) */
.tg-btn-charcoal { background:#2c2a35; color:#ffffff; border-color:#2c2a35; }
.tg-btn-charcoal:hover, .tg-btn-charcoal:focus { background:#16141d; border-color:#16141d; color:#ffffff; }

/* APP-STORE style tiles: bold filled glyph on colored rounded square */
.tg-appwall { display:grid; grid-template-columns:repeat(auto-fill,minmax(122px,1fr)); gap:1.5rem 1rem; margin:0.6rem 0 0.9rem; }
.tg-app { display:flex; flex-direction:column; align-items:center; text-align:center; gap:0.55rem; }
.tg-app-ic { width:80px; height:80px; border-radius:20px; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 18px rgba(26,21,48,0.22); transition:transform 0.15s, box-shadow 0.15s; }
.tg-app:hover .tg-app-ic { transform:translateY(-3px); box-shadow:0 13px 24px rgba(26,21,48,0.28); }
.tg-app-glyph { width:42px; height:42px; color:#ffffff; stroke-width:2.0px; }
.tg-app-name { font-size:0.86rem; font-weight:600; color:var(--tg-ink); line-height:1.22; }

/* REBUILT FOOTER with real social iconography */
.tg-footer { border-top:1px solid var(--tg-border); padding:3rem 0 2.2rem; font-size:0.9rem; color:var(--tg-muted); background:var(--tg-bg-soft); }
.tg-footer-grid { display:grid; grid-template-columns:1.7fr 1fr 1fr; gap:2.2rem; }
@media (max-width:760px){ .tg-footer-grid{ grid-template-columns:1fr; gap:1.6rem; } }
.tg-footer-brand .tg-brand { font-size:1.2rem; font-weight:800; color:var(--tg-ink); margin-bottom:0.6rem; }
.tg-footer-brand p { font-size:0.92rem; max-width:44ch; margin:0 0 1rem; color:var(--tg-muted); }
.tg-social { display:flex; gap:0.7rem; }
.tg-soc { width:40px; height:40px; border-radius:10px; display:flex; align-items:center; justify-content:center; transition:transform 0.14s; }
.tg-soc:hover { transform:translateY(-2px); }
.tg-soc svg { width:21px; height:21px; fill:#ffffff; }
.tg-soc-li { background:#0A66C2; } .tg-soc-yt { background:#FF0000; }
.tg-footer-col h4 { font-size:0.8rem; text-transform:uppercase; letter-spacing:0.09em; color:var(--tg-ink); margin:0.2rem 0 0.8rem; }
.tg-footer-col a { display:block; margin-bottom:0.55rem; color:var(--tg-green-dark); text-decoration:none; font-size:0.92rem; }
.tg-footer-col a:hover { text-decoration:underline; }
.tg-footer-legal { margin-top:1.8rem; padding-top:1.2rem; border-top:1px solid var(--tg-border); font-size:0.85rem; color:var(--tg-muted); }
.tg-footer-legal a { color:var(--tg-green-dark); text-decoration:none; }


/* ===== v10: illustrated section graphics ===== */
.tg-band { display:grid; grid-template-columns:1.05fr 0.95fr; gap:2rem; align-items:center; }
.tg-band-text { min-width:0; }
.tg-band-art { display:flex; justify-content:center; }
.tg-band-art img { width:min(100%,400px); height:auto; }
@media (max-width:760px){ .tg-band{ grid-template-columns:1fr; } .tg-band-art{ display:none; } }


/* fix-pack v15 */
body { margin: 0; }
.tg-page a.tg-btn-primary, .tg-page a.tg-btn-charcoal { color: #ffffff; }
.tg-page a.tg-btn-ghost { color: var(--tg-green-dark); }


/* hero-layout v16: copy left, tree pinned full-height bottom-right */
.tg-hero { position: relative; overflow: hidden; }
.tg-hero-grid { display: block; }
.tg-hero-copy { max-width: 600px; position: relative; z-index: 2; }
.tg-hero-art { position: absolute; right: 0; top: 0; bottom: 0; width: 54%; display: flex; align-items: flex-end; justify-content: flex-end; z-index: 1; min-height: 0; }
.tg-hero-art img { height: 97vh; width: auto; max-width: none; }
@media (max-width: 820px) {
  .tg-hero { overflow: visible; }
  .tg-hero-art { position: static; width: auto; justify-content: center; }
  .tg-hero-art img { height: auto; width: min(82%, 360px); }
  .tg-hero-copy { max-width: none; }
}


/* v17: Denver danger-report stats */
.tg-stats { display:flex; flex-wrap:wrap; gap:2.4rem; margin:1.8rem 0 0.4rem; }
.tg-stat-num { display:block; font-size:2.7rem; font-weight:800; color:var(--tg-green-dark); line-height:1; }
.tg-stat-label { display:block; font-size:0.95rem; color:var(--tg-body); margin-top:0.35rem; max-width:22ch; }


/* v19: chalkboard stat images */
.tg-stats-board { display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; margin:1.8rem 0 0.6rem; align-items:start; }
@media (max-width:680px){ .tg-stats-board{ grid-template-columns:1fr; } }
.tg-board { text-align:center; }
.tg-board img { width:100%; max-width:230px; height:auto; }
.tg-board-label { display:block; font-size:0.95rem; color:var(--tg-body); margin:0.6rem auto 0; max-width:26ch; }
