:root {
  --cream: #fff6e8;
  --paper: #f7ecdc;
  --ink: #201719;
  --brown: #4a3730;
  --muted: #6c5e5d;
  --fuchsia: #e33b96;
  --chartreuse: #dcff45;
  --teal: #36bfa4;
  --cobalt: #4547ee;
  --coral: #ff8f9a;
  --slate: #656475;
  --max: 1180px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at 6% 16%, rgba(92,169,151,.13), transparent 19rem),
    radial-gradient(circle at 92% 10%, rgba(212,85,145,.10), transparent 20rem),
    linear-gradient(135deg, rgba(82,83,214,.018) 25%, transparent 25%, transparent 50%, rgba(82,83,214,.018) 50%, rgba(82,83,214,.018) 75%, transparent 75%),
    var(--cream);
  background-size: auto, auto, 34px 34px, auto;
  text-rendering: optimizeLegibility;
}
a { color: inherit; text-decoration-thickness: 0.08em; text-underline-offset: 0.24em; }
a:hover { text-decoration-thickness: .16em; }
.skip { position: absolute; left: 1rem; top: -4rem; z-index: 20; background: var(--ink); color: white; padding: .85rem 1rem; border-radius: 999px; }
.skip:focus { top: 1rem; }
.site-header { max-width: var(--max); margin: 0 auto; padding: 28px clamp(22px,4vw,46px); display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.brand { font-family: Alegreya, Georgia, serif; font-weight: 700; font-size: clamp(1.35rem,2vw,1.75rem); letter-spacing: -.035em; text-decoration: none; }
.brand span { color: var(--fuchsia); font-style: italic; }
nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 15px 26px; font-size: .9rem; }
nav a { text-decoration: none; font-weight: 850; color: var(--brown); }
nav a:hover, nav a[aria-current="page"] { color: var(--fuchsia); }
nav a:focus-visible, .brand:focus-visible, .action:focus-visible, .page-card:focus-visible, .project-panel a:focus-visible, .friend-panel a:focus-visible, .now-panel a:focus-visible, .tech-panel a:focus-visible { outline: 4px solid var(--chartreuse); outline-offset: 5px; }
main { overflow: hidden; }
.hero, .page-hero, .section, .statement, footer { max-width: var(--max); margin: 0 auto; padding-left: clamp(22px,4vw,46px); padding-right: clamp(22px,4vw,46px); }
.hero { min-height: 585px; padding-top: clamp(44px,6vw,80px); padding-bottom: clamp(28px,4vw,48px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(400px, .84fr); gap: clamp(34px,6vw,78px); align-items: center; }
.page-hero { padding-top: clamp(56px,7vw,96px); padding-bottom: clamp(36px,5vw,66px); }
.eyebrow, .num, .page-card span, .map-node span { margin: 0 0 18px; text-transform: uppercase; letter-spacing: .17em; font-size: .74rem; font-weight: 900; color: var(--fuchsia); }
.eyebrow.magenta { color: var(--fuchsia); }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: Alegreya, Georgia, serif; font-weight: 700; letter-spacing: -.056em; }
h1 { max-width: 810px; font-size: clamp(3.05rem,6.85vw,6.95rem); line-height: .88; margin-bottom: 24px; }
h2 { font-size: clamp(2rem,4.2vw,4.35rem); line-height: .93; margin-bottom: 22px; }
h3 { margin: 0 0 12px; font-size: clamp(1.14rem,1.6vw,1.45rem); letter-spacing: -.035em; line-height: 1.08; font-weight: 900; }
.lede { max-width: 690px; margin: 0 0 20px; color: #4f4443; font-size: clamp(1.08rem,1.55vw,1.34rem); line-height: 1.56; }
p, .body-copy, .body-stack p, .project-panel p, .writing-panel p, .friend-panel p, .now-panel p, .page-card p, .map-node p, footer p { color: var(--muted); line-height: 1.62; font-size: clamp(1rem,1.25vw,1.08rem); }
.hero-actions, .connect-actions { display: flex; gap: 13px; flex-wrap: wrap; margin-top: 34px; }
.action { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; padding: 13px 19px; border-radius: 999px; text-decoration: none; font-weight: 900; box-shadow: 0 14px 36px rgba(32,23,25,.08); background: var(--chartreuse); color: var(--ink); }
.action.primary { background: var(--ink); color: white; box-shadow: 0 14px 36px rgba(32,23,25,.10); }
.action.hot { background: var(--fuchsia); color: white; box-shadow: 0 16px 40px rgba(227,59,150,.18); }
.mood-board { position: relative; min-height: 540px; }
.pattern, .portrait-card, .yes-card { position: absolute; box-shadow: 0 28px 84px rgba(32,23,25,.13); }
.pattern { border-radius: 34px; }
.textile-one { inset: 18px 56px 104px 0; transform: rotate(-3deg); background: repeating-linear-gradient(90deg, rgba(255,143,154,.68) 0 19px, rgba(255,246,232,.78) 19px 38px, rgba(54,191,164,.58) 38px 57px, rgba(255,246,232,.78) 57px 76px); }
.textile-two { inset: 92px 0 28px 84px; transform: rotate(4deg); opacity: .78; background: linear-gradient(135deg, rgba(220,255,69,.82) 0 24%, transparent 24% 35%, rgba(69,71,238,.62) 35% 55%, transparent 55% 66%, rgba(227,59,150,.70) 66% 100%); }
.portrait-card { right: 22px; top: 84px; width: 300px; height: 300px; margin: 0; border: 13px solid var(--cream); border-radius: 50%; overflow: hidden; }
.portrait-card img { display: block; width: 100%; height: 100%; object-fit: cover; filter: none; }
.yes-card { left: 36px; bottom: 28px; padding: 21px 25px; border-radius: 26px; color: white; background: var(--ink); transform: rotate(-2deg); }
.yes-card strong { display: block; font-family: Alegreya, Georgia, serif; font-size: clamp(3.25rem,6vw,5rem); line-height: .76; color: var(--chartreuse); }
.statement { padding-top: clamp(20px,3vw,38px); padding-bottom: clamp(36px,5vw,62px); }
.statement p, .context-intro p { font-family: Alegreya, Georgia, serif; font-weight: 700; letter-spacing: -.052em; font-size: clamp(1.45rem,3vw,3.05rem); line-height: 1.02; max-width: 960px; color: var(--ink); margin-bottom: 20px; }
.electric p:first-child, .thesis-strip p { color: var(--fuchsia); font-style: italic; }
.statement.electric p:not(:first-child) { font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: clamp(1.08rem,1.6vw,1.36rem); line-height: 1.58; letter-spacing: -.012em; font-weight: 500; max-width: 980px; }
.section { padding-top: clamp(50px,6vw,86px); padding-bottom: clamp(50px,6vw,86px); }
.page-grid, .map-grid { display: grid; gap: 20px; }
.page-grid { grid-template-columns: repeat(3, 1fr); }
.page-card, .project-panel, .writing-panel, .map-node { position: relative; overflow: hidden; border-radius: 32px; padding: clamp(24px,3vw,34px); background: rgba(255,255,255,.62); box-shadow: 0 22px 70px rgba(32,23,25,.07); }
.page-card { min-height: 245px; display: flex; flex-direction: column; justify-content: space-between; text-decoration: none; transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }
.page-card::before, .project-panel::before, .writing-panel::before, .map-node::before { content: ""; position: absolute; right: -54px; bottom: -60px; width: 170px; height: 170px; border-radius: 42px; transform: rotate(14deg); opacity: .44; background: var(--teal); }
.page-card:nth-child(2)::before, .project-panel.leni::before, .writing-panel:nth-child(2)::before { background: var(--coral); }
.page-card:nth-child(3)::before, .project-panel.waffle::before, .writing-panel:nth-child(3)::before { background: var(--chartreuse); opacity: .50; }
.page-card:nth-child(4)::before, .writing-panel:nth-child(4)::before { background: var(--cobalt); opacity: .18; }
.page-card:nth-child(5)::before { background: var(--fuchsia); opacity: .22; }
.page-card:nth-child(6)::before { background: var(--coral); opacity: .36; }
.page-card:nth-child(7)::before { background: var(--chartreuse); opacity: .42; }
.page-card > *, .project-panel > *, .writing-panel > *, .map-node > * { position: relative; z-index: 1; }
.page-card:hover { transform: translateY(-3px); background: rgba(255,255,255,.74); box-shadow: 0 30px 84px rgba(32,23,25,.10); }
.hot-panel, .map-node.hot-node { background: var(--ink); color: white; }
.hot-panel::before, .map-node.hot-node::before { background: rgba(220,255,69,.72); opacity: .52; }
.hot-panel p, .hot-panel .num, .map-node.hot-node p, .map-node.hot-node span { color: rgba(255,255,255,.84); }
.hot-panel h2, .map-node.hot-node h2 { color: white; }
.page-card.loud { background: linear-gradient(135deg, rgba(255,246,232,.90), rgba(54,191,164,.20)); color: var(--ink); }
.page-card.loud::before { right: -56px; bottom: -68px; width: 190px; height: 190px; border-radius: 52px; background: var(--ink); opacity: .18; transform: rotate(14deg); }
.page-card.loud::after { content: ""; position: absolute; inset: 0 auto 0 0; width: 16px; background: repeating-linear-gradient(180deg, var(--ink) 0 18px, var(--cream) 18px 34px, var(--fuchsia) 34px 52px, var(--cream) 52px 68px, var(--teal) 68px 86px); opacity: .72; z-index: 0; }
.page-card.loud p, .page-card.loud span { color: var(--muted); }
.page-card.loud h3 { color: var(--ink); }
.project-panel { margin-bottom: 24px; }
.project-panel.gedi { background: rgba(220,255,69,.42); }
.project-panel.leni { background: rgba(255,143,154,.38); }
.project-panel.waffle { background: rgba(54,191,164,.34); }
.quiet-label { display: inline-block; margin-top: 12px; font-weight: 900; color: var(--fuchsia); }
.split { display: grid; grid-template-columns: .86fr 1fr; gap: clamp(36px,8vw,110px); align-items: start; }
.hot-split { margin-top: 22px; margin-bottom: 52px; border-radius: 42px; background: var(--paper); box-shadow: 0 22px 78px rgba(32,23,25,.08); position: relative; overflow: hidden; }
.hot-split::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 16px; background: repeating-linear-gradient(180deg, rgba(212,85,145,.45) 0 20px, rgba(255,246,232,.72) 20px 40px, rgba(54,191,164,.56) 40px 60px, rgba(255,246,232,.72) 60px 80px); }
.body-stack p { margin-bottom: 22px; }
.writing-page { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
.writing-panel { min-height: 245px; }
.writing-panel.pink-panel { background: linear-gradient(135deg, rgba(255,255,255,.94), rgba(255,229,236,.92)); color: var(--ink); }
.writing-panel.pink-panel::before { background: rgba(255,82,139,.24); opacity: .74; }
.writing-panel.pink-panel::after { content: ""; position: absolute; inset: 0 0 auto 0; height: 18px; background: repeating-linear-gradient(90deg, rgba(255,82,139,.30) 0 22px, rgba(255,255,255,.55) 22px 42px, rgba(255,190,118,.22) 42px 62px, rgba(255,255,255,.55) 62px 82px); opacity: .88; z-index: 0; }
.writing-panel.pink-panel h2 { color: var(--ink); }
.writing-panel.pink-panel p { color: var(--muted); }
.friend-board, .now-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; align-items: stretch; }
.friend-panel, .now-panel { position: relative; overflow: hidden; border-radius: 34px; padding: clamp(25px,3.2vw,38px); background: rgba(255,255,255,.66); box-shadow: 0 22px 70px rgba(32,23,25,.07); min-height: 260px; display: flex; flex-direction: column; align-items: flex-start; }
.friend-panel::before, .now-panel::before { content: ""; position: absolute; right: -52px; bottom: -58px; width: 188px; height: 188px; border-radius: 46px; transform: rotate(13deg); background: var(--teal); opacity: .35; }
.friend-panel > *, .now-panel > * { position: relative; z-index: 1; }
.friend-panel .action, .now-panel .action { margin-top: auto; }
.friend-panel h2, .now-panel h2 { font-size: clamp(1.9rem,3.2vw,3.35rem); }
.featured-friend, .big-now { grid-column: span 2; min-height: 310px; background: linear-gradient(135deg, rgba(255,246,232,.92), rgba(255,143,154,.24)); }
.featured-friend::before, .big-now::before { width: 260px; height: 260px; border-radius: 62px; background: repeating-linear-gradient(90deg, rgba(255,143,154,.70) 0 21px, rgba(255,246,232,.72) 21px 41px, rgba(54,191,164,.54) 41px 62px, rgba(255,246,232,.72) 62px 82px); opacity: .68; }
.friend-panel:nth-child(2)::before, .now-panel:nth-child(2)::before { background: var(--chartreuse); opacity: .46; }
.friend-panel:nth-child(3)::before, .now-panel:nth-child(3)::before { background: var(--cobalt); opacity: .16; }
.friend-panel:nth-child(4)::before, .now-panel:nth-child(4)::before { background: var(--fuchsia); opacity: .20; }
.curated-friends .friend-panel:nth-child(6n+1) { background: linear-gradient(135deg, rgba(255,246,232,.92), rgba(220,255,69,.22)); }
.curated-friends .friend-panel:nth-child(6n+2) { background: linear-gradient(135deg, rgba(255,255,255,.78), rgba(255,143,154,.24)); }
.curated-friends .friend-panel:nth-child(6n+3) { background: linear-gradient(135deg, rgba(255,246,232,.88), rgba(54,191,164,.26)); }
.curated-friends .friend-panel:nth-child(6n+4) { background: linear-gradient(135deg, rgba(255,255,255,.80), rgba(82,83,214,.13)); }
.curated-friends .friend-panel:nth-child(6n+5) { background: linear-gradient(135deg, rgba(255,246,232,.90), rgba(255,190,118,.30)); }
.curated-friends .friend-panel:nth-child(6n+6) { background: linear-gradient(135deg, rgba(255,255,255,.82), rgba(227,59,150,.16)); }
.curated-friends .friend-panel:nth-child(6n+1)::before { background: var(--chartreuse); opacity: .40; border-radius: 50%; transform: rotate(-10deg); }
.curated-friends .friend-panel:nth-child(6n+2)::before { background: var(--fuchsia); opacity: .22; border-radius: 54px 26px 54px 26px; transform: rotate(15deg); }
.curated-friends .friend-panel:nth-child(6n+3)::before { background: var(--teal); opacity: .36; border-radius: 34px 62px 34px 62px; transform: rotate(-14deg); }
.curated-friends .friend-panel:nth-child(6n+4)::before { background: var(--cobalt); opacity: .18; border-radius: 50%; transform: rotate(8deg); }
.curated-friends .friend-panel:nth-child(6n+5)::before { background: var(--coral); opacity: .34; border-radius: 58px 24px 44px 30px; transform: rotate(20deg); }
.curated-friends .friend-panel:nth-child(6n+6)::before { background: var(--fuchsia); opacity: .20; border-radius: 30px 64px 30px 64px; transform: rotate(-18deg); }
.friend-panel.soft-note, .curated-friends .friend-panel.soft-note, .now-panel.not-now { background: var(--ink); color: white; }
.friend-panel.soft-note h2, .now-panel.not-now h2 { color: white; }
.friend-panel.soft-note p, .friend-panel.soft-note .num, .now-panel.not-now p, .now-panel.not-now .num { color: rgba(255,255,255,.82); }
.friend-panel.soft-note::before, .curated-friends .friend-panel.soft-note::before, .now-panel.not-now::before { background: rgba(220,255,69,.72); opacity: .52; }
.now-stamp { display: inline-flex; align-items: center; margin-top: 14px; padding: .75rem 1rem; border-radius: 999px; font-weight: 900; color: var(--ink); background: rgba(220,255,69,.62); }
.now-explainer { max-width: 720px; margin-top: 28px; padding: clamp(20px,3vw,30px); border-radius: 32px 46px 30px 38px; background: linear-gradient(135deg, rgba(255,255,255,.72), rgba(255,143,154,.22)); box-shadow: 0 22px 70px rgba(32,23,25,.07); }
.now-explainer a { display: inline-flex; margin-bottom: 10px; font-family: Alegreya, Georgia, serif; font-size: clamp(1.7rem,3vw,2.7rem); line-height: .92; letter-spacing: -.045em; font-weight: 700; color: var(--fuchsia); text-decoration-thickness: .08em; }
.now-explainer p { max-width: 620px; margin: 0; color: var(--brown); font-size: clamp(1.02rem,1.38vw,1.18rem); line-height: 1.58; }

/* Purposeful giving */
.giving-page-body .site-header { padding-bottom: clamp(18px, 3vw, 34px); }
.giving-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(330px, .7fr); gap: clamp(34px, 7vw, 100px); align-items: center; }
.giving-thesis { max-width: var(--max); margin: 0 auto; padding: clamp(12px, 2vw, 24px) clamp(22px, 4vw, 46px) clamp(48px, 6vw, 82px); }
.giving-thesis p { max-width: 1120px; margin: 0 auto; color: var(--fuchsia); font-family: Alegreya, Georgia, serif; font-size: clamp(1.9rem, 4vw, 4.2rem); line-height: 1.02; letter-spacing: -.055em; font-weight: 700; text-align: center; }
.giving-hero-reframed h1 { max-width: 900px; }
.giving-hero-reframed .giving-lede strong { color: var(--fuchsia); }
.giving-begin { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(34px, 8vw, 110px); align-items: center; }
.begin-copy p:not(.eyebrow) { max-width: 620px; }
.identity-shift { min-height: 280px; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 18px; padding: clamp(28px, 5vw, 58px); border-radius: 42px; background: var(--ink); color: white; box-shadow: 0 22px 78px rgba(32,23,25,.08); font-family: Alegreya, Georgia, serif; font-size: clamp(1.7rem, 3.6vw, 3.7rem); line-height: .9; text-align: center; }
.identity-shift strong { color: var(--chartreuse); font-family: Inter, sans-serif; font-size: clamp(2rem, 4vw, 4rem); }
.identity-destination { color: var(--chartreuse); }
.education-portrait { max-width: 360px; margin-bottom: 8px; border-radius: 42px 64px 38px 52px; overflow: hidden; box-shadow: 0 22px 70px rgba(32,23,25,.12); }
.education-portrait img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 15%; }
.giving-education { grid-template-columns: minmax(280px, .95fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 58px); }
.output-intro { max-width: 580px; color: var(--ink); font-family: Alegreya, Georgia, serif; font-size: clamp(1.3rem, 2vw, 1.8rem); line-height: 1.1; }
.giving-begin { grid-template-columns: 1fr; gap: 30px; text-align: center; }
.giving-begin .begin-copy { max-width: 860px; margin: 0 auto; }
.giving-begin .begin-copy p:not(.eyebrow) { max-width: 760px; margin-left: auto; margin-right: auto; }
.begin-title-heading { font-size: clamp(2.2rem, 4.4vw, 4.6rem); line-height: 1.05; max-width: 860px; margin-left: auto; margin-right: auto; text-wrap: balance; }
.giving-begin .identity-shift { width: min(760px, 100%); margin: 0 auto; }
@media (max-width: 980px) {
  .giving-begin { grid-template-columns: 1fr; }
  .giving-education { grid-template-columns: minmax(180px, .65fr) 1fr; }
  .education-fields { grid-column: 1 / -1; padding-top: 0; }
}
@media (max-width: 700px) {
  .giving-education { grid-template-columns: 1fr; }
  .education-portrait { max-width: 280px; }
  .identity-shift { min-height: 220px; }
}
.giving-lede { max-width: 650px; margin: 0; color: var(--brown); font-size: clamp(1.12rem, 1.7vw, 1.42rem); line-height: 1.52; }
.giving-hero-art { position: relative; min-height: 410px; isolation: isolate; }
/* The selected drawn direction: one continuous thought, with chartreuse as a single high-energy accent. */
.giving-drawn-art { min-height: 520px; overflow: visible; }
.giving-drawn-line { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.giving-drawn-line path { fill: none; stroke: var(--cobalt); stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }
.giving-drawn-line .drawn-arrow { stroke: var(--fuchsia); stroke-width: 4; }
.drawn-word { position: absolute; z-index: 2; font-family: Alegreya, Georgia, serif; font-weight: 700; line-height: .86; letter-spacing: -.045em; text-align: center; }
.drawn-word em { color: var(--fuchsia); font-style: normal; }
.drawn-values { left: 0; top: 110px; color: var(--cobalt); font-size: clamp(1.8rem, 3vw, 2.7rem); transform: rotate(-8deg); }
.drawn-intention { left: 37%; top: 118px; padding: 24px 30px 27px; border-radius: 52% 46% 54% 48%; background: var(--chartreuse); color: var(--ink); font-size: clamp(2rem, 3.7vw, 3.4rem); transform: rotate(4deg); box-shadow: 0 18px 50px rgba(32,23,25,.10); }
.drawn-intention strong { display: block; line-height: .72; }
.drawn-intention small { display: block; margin-top: 13px; color: var(--cobalt); font: 900 .58rem/1 Inter, sans-serif; letter-spacing: .11em; text-transform: uppercase; }
.drawn-change { right: 1%; bottom: 82px; color: var(--ink); font-size: clamp(1.8rem, 3vw, 2.65rem); }
.drawn-accent { position: absolute; z-index: -1; right: 4%; bottom: 34px; width: 210px; height: 150px; border-radius: 48% 52% 44% 56%; background: rgba(54,191,164,.55); transform: rotate(8deg); }
/* Keep the gesture behind the words, but give each phrase a quiet paper halo so the line never cuts through the lettering. */
.drawn-values, .drawn-intention, .drawn-change { isolation: isolate; }
.drawn-values::before, .drawn-intention::before, .drawn-change::before { content: ""; position: absolute; z-index: -1; inset: -12px -18px; border-radius: 50%; background: var(--cream); }
.drawn-intention::before { inset: -5px -8px; background: var(--chartreuse); }
.drawn-change::before { inset: -12px -20px; background: rgba(54,191,164,.72); }
.giving-drawn-line .drawn-arrow { marker-end: none; }
@media (max-width: 560px) {
  .giving-drawn-art { min-height: 360px; }
  .drawn-values { left: 0; top: 74px; font-size: 1.55rem; }
  .drawn-intention { left: 31%; top: 80px; padding: 18px 21px 20px; font-size: 2.25rem; }
  .drawn-intention small { margin-top: 10px; font-size: .48rem; }
  .drawn-change { right: 0; bottom: 43px; font-size: 1.55rem; }
  .drawn-accent { right: 0; bottom: 15px; width: 145px; height: 100px; }
  .giving-drawn-line path { stroke-width: 4; }
}
.giving-statement { padding-top: 10px; }
.giving-statement p:first-child { max-width: 800px; }
.giving-statement p:not(:first-child) { max-width: 900px; }
.giving-section-intro { display: grid; grid-template-columns: .82fr 1.18fr; column-gap: clamp(28px, 7vw, 100px); align-items: start; margin-bottom: 44px; }
.giving-section-intro .eyebrow { grid-column: 1; }
.giving-section-intro h2 { grid-column: 1; }
.giving-section-intro > p:last-child { grid-column: 2; grid-row: 1 / span 2; align-self: end; max-width: 560px; margin: 0; }
.giving-steps { display: grid; grid-template-columns: repeat(6, 1fr); gap: 18px; }
.giving-step { grid-column: span 2; min-height: 245px; position: relative; overflow: hidden; padding: 28px; border-radius: 32px; background: rgba(255,255,255,.65); box-shadow: 0 22px 70px rgba(32,23,25,.07); }
.giving-step::after { content: ""; position: absolute; width: 145px; height: 145px; right: -46px; bottom: -50px; border-radius: 50%; background: var(--coral); opacity: .35; }
.giving-step > * { position: relative; z-index: 1; }
.giving-step span { display: block; margin-bottom: 24px; color: var(--fuchsia); font-size: .74rem; font-weight: 900; letter-spacing: .17em; }
.giving-step p { margin-bottom: 0; }
.giving-step.step-loud { background: linear-gradient(135deg, rgba(255,246,232,.90), rgba(54,191,164,.25)); }
.giving-step.step-loud::after { background: var(--ink); opacity: .16; }
.giving-step:nth-child(2)::after { background: var(--chartreuse); }
.giving-step:nth-child(3)::after { background: var(--cobalt); opacity: .16; }
.giving-step:nth-child(4)::after { background: var(--fuchsia); opacity: .20; }
.giving-step.step-dark { grid-column: span 3; background: var(--ink); color: white; }
.giving-step.step-dark span, .giving-step.step-dark p { color: rgba(255,255,255,.82); }
.giving-step.step-dark::after { background: var(--chartreuse); opacity: .45; }
.giving-education { display: flex; flex-direction: column; gap: 0; padding-top: clamp(40px, 6vw, 70px); padding-bottom: clamp(40px, 6vw, 70px); }
.giving-education .education-story-row { display: grid; grid-template-columns: minmax(240px, .85fr) minmax(0, 1.15fr); gap: clamp(28px, 4vw, 58px); align-items: center; margin-bottom: clamp(48px, 7vw, 84px); }
.education-copy p { max-width: 590px; }
.education-focus-cloud-unit { max-width: 960px; margin: 0 auto; text-align: center; width: 100%; }
.education-thesis-centered { margin: 0 0 clamp(28px, 4vw, 40px); text-align: center; max-width: none; padding: 0; }
.education-thesis-centered p { font-family: Alegreya, Georgia, serif; font-weight: 700; letter-spacing: -.052em; font-size: clamp(2.1rem, 4.4vw, 3.85rem); line-height: 1.04; color: var(--fuchsia); max-width: 860px; margin: 0 auto; text-align: center; }
.education-fields-cloud { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 14px 16px; max-width: 890px; margin: 0 auto; padding: 0; }
.education-fields-cloud span { display: inline-flex; align-items: center; justify-content: center; min-height: 64px; padding: .48em 1.15em .55em; border-radius: 999px; color: var(--ink); font-family: Alegreya, Georgia, serif; font-size: clamp(1.4rem, 2.2vw, 2.15rem); font-weight: 700; line-height: .95; letter-spacing: -.045em; white-space: nowrap; transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s ease; cursor: default; }
.education-fields-cloud span:hover { transform: translateY(-3px) scale(1.02); box-shadow: 0 10px 24px rgba(32,23,25,.08); }
.education-fields-cloud span:nth-child(1) { background: #c3e7d9; }
.education-fields-cloud span:nth-child(2) { background: #ffd0d0; }
.education-fields-cloud span:nth-child(3) { background: #f0ff9a; }
.education-fields-cloud span:nth-child(4) { background: #e5e2f1; }
.education-fields-cloud span:nth-child(5) { background: #ffd2d7; }
.education-fields-cloud span:nth-child(6) { background: #c3e7d9; }
.education-fields-cloud span:nth-child(7) { background: #ffd0d0; }
.education-fields-cloud span:nth-child(8) { background: #f0ff9a; }
@media (max-width: 980px) {
  .giving-education .education-story-row { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .education-fields-cloud { gap: 10px; }
  .education-fields-cloud span { font-size: 1.35rem; min-height: 52px; padding: .4em .85em; white-space: normal; text-align: center; }
}
.giving-output { padding-top: 30px; }
.output-card { position: relative; overflow: hidden; padding: clamp(28px, 5vw, 58px); border-radius: 42px; background: var(--paper); box-shadow: 0 22px 78px rgba(32,23,25,.08); }
.output-card::before { content: ""; position: absolute; right: -60px; bottom: -90px; width: 300px; height: 300px; border-radius: 50%; background: rgba(54,191,164,.34); }
.output-card > * { position: relative; z-index: 1; }
.output-card h2 { max-width: 720px; }
.output-columns { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px 40px; max-width: 820px; }
.output-columns p { margin: 0; padding: 16px 0 16px 24px; border-left: 5px solid var(--fuchsia); color: var(--brown); }
.giving-closing { max-width: none; padding-top: clamp(70px, 10vw, 150px); padding-bottom: clamp(70px, 10vw, 140px); padding-left: max(clamp(22px, 4vw, 46px), calc((100vw - var(--max)) / 2 + clamp(22px, 4vw, 46px))); padding-right: max(clamp(22px, 4vw, 46px), calc((100vw - var(--max)) / 2 + clamp(22px, 4vw, 46px))); background: var(--cobalt); color: white; } .giving-closing h2 { color: white; } .giving-closing > p:not(.eyebrow) { color: rgba(255,255,255,.86); } .giving-closing .eyebrow { color: var(--chartreuse); }
.giving-closing h2 { max-width: 890px; }
.giving-closing > p:not(.eyebrow) { max-width: 660px; }
.giving-closing .action { margin-top: 16px; }
.giving-card { background: linear-gradient(135deg, rgba(255,246,232,.92), rgba(54,191,164,.26)); }
.giving-card::before { background: var(--fuchsia); opacity: .24; }
.giving-process { position: relative; }
.giving-process .giving-section-intro .eyebrow::before { content: "04 / "; }
.giving-process .giving-step { border-radius: 32px 38px 28px 42px; }
.giving-process .giving-step:nth-child(2) { border-radius: 38px 28px 42px 32px; }
.giving-process .giving-step:nth-child(3) { border-radius: 28px 44px 34px 38px; }
.giving-process .giving-step:nth-child(4) { border-radius: 44px 32px 38px 28px; }
.giving-process .giving-step.step-dark { border-radius: 38px 28px 46px 32px; }
@media (max-width: 980px) {
  .giving-hero, .giving-education { grid-template-columns: 1fr; }
  .giving-hero-art { max-width: 560px; width: 100%; }
  .giving-section-intro { grid-template-columns: 1fr; }
  .giving-section-intro .eyebrow, .giving-section-intro h2, .giving-section-intro > p:last-child { grid-column: 1; grid-row: auto; }
  .giving-section-intro > p:last-child { margin-top: 4px; }
}
@media (max-width: 700px) {
  .giving-steps { grid-template-columns: 1fr; }
  .giving-step, .giving-step.step-dark { grid-column: auto; }
  .output-columns { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .giving-hero-art { min-height: 330px; }
  .orbit-one { inset: 34px 20px 32px 20px; border-width: 15px; }
  .orbit-two { inset: 6px 68px 98px 88px; border-width: 12px; }
  .giving-note { padding: 14px; font-size: 1.38rem; }
  .giving-note span { max-width: 104px; }
  .note-values { top: 92px; }
  .note-action { bottom: 20px; }
  .giving-stamp { right: 52px; top: 48px; width: 104px; height: 104px; }
  .giving-stamp strong { font-size: 2.6rem; }
  .giving-stamp small { font-size: .58rem; }
}
.now-invite { margin-top: clamp(26px,4vw,54px); margin-bottom: clamp(26px,4vw,54px); padding-top: clamp(28px,4vw,52px); padding-bottom: clamp(28px,4vw,52px); border-radius: 42px; background: var(--ink); color: white; }
.now-invite .eyebrow { color: var(--chartreuse); }
.now-invite h2 { max-width: 920px; margin: 0; color: white; font-size: clamp(2rem,4vw,4.1rem); }
.now-list { margin: 0; padding-left: 1.2rem; color: rgba(255,255,255,.84); line-height: 1.72; font-size: clamp(1.02rem,1.3vw,1.12rem); }
.now-list li + li { margin-top: .45rem; }

.tech-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; align-items: stretch; padding-top: clamp(22px,4vw,56px); }
.tech-panel { position: relative; overflow: hidden; border-radius: 34px; padding: clamp(25px,3.2vw,38px); background: rgba(255,255,255,.66); box-shadow: 0 22px 70px rgba(32,23,25,.07); min-height: 250px; display: flex; flex-direction: column; align-items: flex-start; }
.tech-panel::before { content: ""; position: absolute; right: -52px; bottom: -58px; width: 188px; height: 188px; border-radius: 46px; transform: rotate(13deg); background: var(--teal); opacity: .35; }
.tech-panel > * { position: relative; z-index: 1; }
.tech-panel h2 { font-size: clamp(1.9rem,3.2vw,3.35rem); }
.tech-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: auto; padding-top: 20px; }
.tech-links .action { min-height: 44px; padding: 11px 17px; }
.tech-panel:nth-child(2n) { background: linear-gradient(135deg, rgba(255,255,255,.80), rgba(255,143,154,.24)); }
.tech-panel:nth-child(3n) { background: linear-gradient(135deg, rgba(255,246,232,.88), rgba(220,255,69,.28)); }
.tech-panel:nth-child(4n) { background: linear-gradient(135deg, rgba(255,255,255,.80), rgba(69,71,238,.13)); }
.tech-panel:nth-child(5n) { background: linear-gradient(135deg, rgba(255,246,232,.90), rgba(54,191,164,.24)); }
.tech-panel:nth-child(2)::before { background: var(--fuchsia); opacity: .20; border-radius: 54px 26px 54px 26px; }
.tech-panel:nth-child(3)::before { background: var(--chartreuse); opacity: .46; border-radius: 50%; }
.tech-panel:nth-child(4)::before { background: var(--cobalt); opacity: .16; }
.tech-panel:nth-child(5)::before { background: var(--coral); opacity: .34; border-radius: 58px 24px 44px 30px; }
.tech-panel:nth-child(6)::before { background: var(--teal); opacity: .38; border-radius: 34px 62px 34px 62px; }
.tech-panel:nth-child(7)::before { background: var(--ink); opacity: .18; }
.tech-panel:nth-child(8)::before { background: var(--fuchsia); opacity: .22; border-radius: 30px 64px 30px 64px; }
.featured-tech { grid-column: span 2; min-height: 310px; background: linear-gradient(135deg, rgba(255,246,232,.92), rgba(255,143,154,.24)); }
.featured-tech::before { width: 260px; height: 260px; border-radius: 62px; background: repeating-linear-gradient(90deg, rgba(255,143,154,.70) 0 21px, rgba(255,246,232,.72) 21px 41px, rgba(54,191,164,.54) 41px 62px, rgba(255,246,232,.72) 62px 82px); opacity: .68; }
.stack-strip { display: grid; grid-template-columns: .72fr 1fr; gap: clamp(32px,6vw,78px); align-items: start; }
.tech-cloud span:nth-child(1) { flex: 0 1 38%; }
.tech-cloud span:nth-child(2) { flex: 0 1 50%; }
.tech-cloud span:nth-child(3) { flex: 0 1 44%; }
.tech-cloud span:nth-child(4) { flex: 0 1 39%; }
.tech-cloud span:nth-child(5) { flex: 0 1 50%; }
.tech-cloud span:nth-child(6) { flex: 0 1 55%; }

.map-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.map-node { min-height: 235px; display: flex; flex-direction: column; justify-content: space-between; margin-bottom: 0; }

.map-node h2 { font-size: clamp(1.45rem,2.4vw,2.45rem); }
.map-node.origin, .map-node.big-node { grid-column: span 2; background: var(--paper); }
.map-node.origin::before, .map-node.big-node::before { background: linear-gradient(135deg, rgba(255,143,154,.70) 0 20%, rgba(255,246,232,.66) 20% 38%, rgba(54,191,164,.56) 38% 56%, rgba(255,246,232,.66) 56% 70%, rgba(220,255,69,.62) 70% 100%); opacity: .68; }
.map-node.closing-node { grid-column: span 3; min-height: auto; background: var(--ink); color: white; }
.map-node.closing-node::before { background: rgba(82,83,214,.26); }
.map-node.closing-node p, .map-node.closing-node span { color: rgba(255,255,255,.82); }

.context-page-body .context-hero { padding-bottom: clamp(18px,3vw,36px); }
.context-page-body .map-grid { padding-top: clamp(22px,4vw,56px); }
.context-page-body .map-node { isolation: isolate; }
.context-page-body .map-node::after { content: ""; position: absolute; z-index: 0; pointer-events: none; }
.context-page-body .map-node span { display: inline-flex; align-items: center; justify-content: center; width: 3.1rem; height: 3.1rem; margin-bottom: 22px; border-radius: 50%; font-family: Alegreya, Georgia, serif; font-size: 1.3rem; line-height: 1; letter-spacing: -.04em; background: rgba(255,255,255,.74); color: var(--ink); box-shadow: 0 12px 32px rgba(32,23,25,.08); }
.context-page-body .node-01 { background: linear-gradient(135deg, rgba(255,246,232,.92), rgba(255,143,154,.30)); border-radius: 52px 28px 36px 36px; }
.context-page-body .node-01::before { inset: auto -44px -54px auto; width: 230px; height: 230px; border-radius: 54px; background: repeating-linear-gradient(90deg, rgba(255,143,154,.72) 0 18px, rgba(255,246,232,.72) 18px 36px, rgba(54,191,164,.58) 36px 54px, rgba(255,246,232,.72) 54px 72px); transform: rotate(-8deg); opacity: .72; }
.context-page-body .node-01::after { left: 28px; bottom: 22px; width: 116px; height: 20px; border-radius: 999px; background: var(--fuchsia); opacity: .22; }
.context-page-body .node-02 { background: rgba(255,143,154,.36); border-radius: 28px 54px 30px 38px; }
.context-page-body .node-02::before { right: -42px; top: -52px; bottom: auto; width: 170px; height: 170px; border-radius: 50%; background: var(--chartreuse); opacity: .54; transform: none; }
.context-page-body .node-02::after { right: 28px; bottom: 28px; width: 72px; height: 72px; border-radius: 22px; background: var(--cobalt); opacity: .16; transform: rotate(16deg); }
.context-page-body .node-03 { background: linear-gradient(135deg, rgba(255,246,232,.88), rgba(220,255,69,.28)); border-radius: 34px 34px 58px 28px; }
.context-page-body .node-03::before { right: -34px; bottom: -42px; width: 184px; height: 184px; border-radius: 42px; background: var(--ink); opacity: .20; transform: rotate(20deg); }
.context-page-body .node-03::after { left: 0; top: 0; width: 18px; height: 100%; background: repeating-linear-gradient(180deg, var(--ink) 0 22px, var(--cream) 22px 40px, var(--teal) 40px 62px, var(--cream) 62px 80px, var(--fuchsia) 80px 102px); opacity: .74; }
.context-page-body .node-04 { background: rgba(54,191,164,.30); border-radius: 52px 30px 52px 30px; }
.context-page-body .node-04::before { right: -20px; bottom: -62px; width: 190px; height: 190px; border-radius: 50%; background: var(--fuchsia); opacity: .22; transform: none; }
.context-page-body .node-04::after { left: 0; bottom: 0; width: 100%; height: 14px; background: repeating-linear-gradient(90deg, var(--teal) 0 24px, transparent 24px 42px, var(--chartreuse) 42px 66px, transparent 66px 84px); opacity: .65; }
.context-page-body .node-05 { background: linear-gradient(135deg, rgba(220,255,69,.58), rgba(255,246,232,.78)); border-radius: 30px 64px 38px 38px; }
.context-page-body .node-05::before { right: -68px; top: 30px; bottom: auto; width: 210px; height: 210px; border-radius: 44px; background: var(--cobalt); opacity: .18; transform: rotate(10deg); }
.context-page-body .node-05::after { left: 0; top: 0; width: 18px; height: 100%; background: repeating-linear-gradient(180deg, var(--fuchsia) 0 20px, var(--cream) 20px 40px, var(--teal) 40px 60px, var(--cream) 60px 80px); opacity: .66; }
.context-page-body .node-06 { background: linear-gradient(150deg, rgba(69,71,238,.18), rgba(255,255,255,.68)); border-radius: 34px 26px 60px 34px; }
.context-page-body .node-06::before { right: -38px; bottom: -44px; width: 170px; height: 170px; border-radius: 34px; background: var(--coral); opacity: .44; transform: rotate(-18deg); }
.context-page-body .node-06::after { right: 30px; top: 30px; width: 64px; height: 20px; border-radius: 999px; background: var(--cobalt); opacity: .32; }
.context-page-body .node-07 { background: linear-gradient(135deg, rgba(255,143,154,.30), rgba(54,191,164,.22)); border-radius: 30px 46px 30px 62px; }
.context-page-body .node-07::before { right: -60px; bottom: 8px; width: 195px; height: 112px; border-radius: 999px; background: var(--teal); opacity: .42; transform: rotate(-20deg); }
.context-page-body .node-07::after { left: 28px; bottom: 28px; width: 58px; height: 58px; border-radius: 18px; background: var(--chartreuse); opacity: .52; transform: rotate(12deg); }
.context-page-body .node-08 { background: linear-gradient(135deg, rgba(255,246,232,.86), rgba(255,143,154,.32)); border-radius: 58px 30px 34px 34px; }
.context-page-body .node-08::before { right: -54px; bottom: -50px; width: 190px; height: 190px; border-radius: 46px; background: repeating-linear-gradient(135deg, rgba(220,255,69,.72) 0 22px, rgba(255,246,232,.72) 22px 42px, rgba(54,191,164,.54) 42px 64px, rgba(255,246,232,.72) 64px 84px); opacity: .62; transform: rotate(10deg); }
.context-page-body .node-08::after { left: 28px; bottom: 26px; width: 88px; height: 88px; border-radius: 28px; background: var(--cobalt); opacity: .14; transform: rotate(-14deg); }
.context-page-body .node-09 { background: linear-gradient(135deg, rgba(54,191,164,.30), rgba(255,246,232,.82)); border-radius: 34px 58px 34px 30px; }
.context-page-body .node-09::before { right: -54px; bottom: -56px; width: 200px; height: 200px; border-radius: 52px; background: var(--coral); opacity: .36; transform: rotate(-14deg); }
.context-page-body .node-09::after { left: 0; top: 0; width: 100%; height: 16px; background: repeating-linear-gradient(90deg, var(--fuchsia) 0 24px, transparent 24px 44px, var(--chartreuse) 44px 68px, transparent 68px 88px, var(--teal) 88px 112px); opacity: .58; }
.context-page-body .node-03 span { background: var(--ink); color: white; }
.thesis-strip { padding-top: 30px; }
.thesis-strip p { font-family: Alegreya, Georgia, serif; font-size: clamp(1.5rem,3.35vw,3.45rem); line-height: 1.06; letter-spacing: -.052em; font-weight: 700; }
.principle-cloud { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 18px 20px; max-width: 1080px; }
.principle-cloud span { display: inline-flex; align-items: center; justify-content: flex-start; font-size: clamp(1.16rem,2.02vw,2.05rem); line-height: 1.04; letter-spacing: -.046em; font-weight: 900; color: var(--ink); border-radius: 30px 44px 34px 42px; padding: .46em .78em .54em; box-shadow: inset 0 0 0 1px rgba(255,255,255,.26), 0 8px 24px rgba(32,23,25,.035); }
.principle-cloud span:nth-child(1) { flex: 0 1 55%; background: rgba(255,255,255,.64); border-radius: 36px 52px 30px 44px; }
.principle-cloud span:nth-child(2) { flex: 0 1 35%; background: rgba(255,143,154,.34); border-radius: 42px 30px 46px 32px; }
.principle-cloud span:nth-child(3) { flex: 0 1 41%; background: rgba(220,255,69,.42); border-radius: 30px 44px 36px 48px; }
.principle-cloud span:nth-child(4) { flex: 0 1 46%; background: rgba(227,59,150,.17); border-radius: 48px 34px 42px 30px; }
.principle-cloud span:nth-child(5) { flex: 0 1 41%; background: rgba(54,191,164,.32); border-radius: 34px 50px 30px 40px; }
.principle-cloud span:nth-child(6) { flex: 0 1 39%; background: rgba(69,71,238,.13); border-radius: 44px 32px 48px 34px; }
.principle-cloud span:nth-child(7) { flex: 0 1 46%; background: rgba(255,190,118,.33); border-radius: 32px 46px 40px 30px; }
.principle-cloud span:nth-child(8) { flex: 0 1 42%; background: rgba(181,138,255,.22); border-radius: 50px 34px 30px 44px; }
footer { padding-top: 34px; padding-bottom: 52px; }
footer p { font-size: .95rem; }
@media (max-width: 980px) {
  .site-header { align-items: flex-start; flex-direction: column; }
  nav { justify-content: flex-start; }
  .hero { grid-template-columns: 1fr; min-height: auto; }
  .mood-board { min-height: 440px; max-width: 560px; }
  .page-grid { grid-template-columns: repeat(2,1fr); }
  .map-grid, .writing-page, .split, .friend-board, .now-grid, .tech-grid, .stack-strip { grid-template-columns: 1fr; }
  .map-node.origin, .map-node.big-node, .map-node.closing-node, .featured-friend, .big-now, .featured-tech { grid-column: span 1; }
}
@media (max-width: 560px) {
  nav { gap: 12px 15px; font-size: .84rem; }
  h1 { font-size: clamp(2.85rem,13vw,4.4rem); }
  h2 { font-size: clamp(1.9rem,9vw,3rem); }
  .hero, .page-hero, .section, .statement, footer { padding-left: 20px; padding-right: 20px; }
  .mood-board { min-height: 370px; }
  .portrait-card { right: 18px; top: 82px; width: 205px; height: 205px; border-width: 9px; }
  .yes-card { left: 14px; bottom: 10px; }
  .textile-one { inset: 12px 40px 94px 0; }
  .textile-two { inset: 86px 0 28px 50px; }
  .page-grid { grid-template-columns: 1fr; }
  .principle-cloud { gap: 14px; }
  .principle-cloud span { flex-basis: 100% !important; min-height: 0; border-radius: 24px 32px 26px 34px; }
  .page-card { min-height: 210px; }
  .statement p, .context-intro p { font-size: clamp(1.38rem,6.5vw,2.15rem); }
}

/* Ideas room */
.ideas-hero { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(34px,7vw,110px); align-items: center; }
.ideas-hero-copy { max-width: 800px; }
.ideas-hero h1 { max-width: 780px; }
.ideas-statement { padding-top: 18px; }
.ideas-statement p:first-child { color: var(--fuchsia); font-style: italic; }
.ideas-statement p:not(:first-child) { max-width: 940px; font-family: Inter, system-ui, sans-serif; font-size: clamp(1.08rem,1.6vw,1.36rem); line-height: 1.58; letter-spacing: -.012em; font-weight: 500; }
.path-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.path-card { position: relative; min-height: 230px; overflow: hidden; padding: clamp(24px,3vw,34px); border-radius: 32px; background: rgba(255,255,255,.62); box-shadow: 0 22px 70px rgba(32,23,25,.07); }
.path-card::before { content: ""; position: absolute; right: -48px; bottom: -62px; width: 170px; height: 170px; border-radius: 50%; background: var(--teal); opacity: .36; }
.path-card:nth-child(2) { background: rgba(255,143,154,.30); }
.path-card:nth-child(2)::before { background: var(--fuchsia); opacity: .19; border-radius: 48px; transform: rotate(16deg); }
.path-card:nth-child(3) { background: linear-gradient(135deg, rgba(255,246,232,.90), rgba(220,255,69,.30)); }
.path-card:nth-child(3)::before { background: var(--cobalt); opacity: .16; border-radius: 44px; transform: rotate(-12deg); }
.path-card > * { position: relative; z-index: 1; }
.path-number { display: block; margin-bottom: 40px; font-family: Alegreya, Georgia, serif; font-size: 2.1rem; font-weight: 700; color: var(--fuchsia); }
.path-card h3 { font-size: clamp(1.45rem,2.2vw,2.05rem); }
.path-card p { max-width: 320px; margin-bottom: 0; }
.shelf-heading { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 34px; }
.shelf-heading h2 { margin-bottom: 0; }
.idea-filters { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; }
.filter-control { appearance: none; border: 0; cursor: pointer; padding: 11px 15px; border-radius: 999px; background: rgba(255,255,255,.68); color: var(--brown); font: inherit; font-size: .82rem; font-weight: 900; box-shadow: 0 8px 22px rgba(32,23,25,.06); }
.filter-control:hover, .filter-control:focus-visible, .filter-control.is-active { background: var(--ink); color: white; }
.filter-control:focus-visible { outline: 4px solid var(--chartreuse); outline-offset: 3px; }
.idea-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; align-items: stretch; }
.idea-card { position: relative; overflow: hidden; min-height: 390px; display: flex; flex-direction: column; align-items: flex-start; padding: clamp(25px,3.2vw,38px); border-radius: 34px; background: rgba(255,255,255,.66); box-shadow: 0 22px 70px rgba(32,23,25,.07); }
.idea-card::before { content: ""; position: absolute; right: -58px; bottom: -68px; width: 205px; height: 205px; border-radius: 58px; transform: rotate(14deg); background: var(--teal); opacity: .30; }
.idea-card:nth-child(3n+2) { background: linear-gradient(135deg, rgba(255,255,255,.82), rgba(255,143,154,.25)); }
.idea-card:nth-child(3n+2)::before { background: var(--fuchsia); opacity: .17; }
.idea-card:nth-child(3n+3) { background: linear-gradient(135deg, rgba(255,246,232,.88), rgba(220,255,69,.28)); }
.idea-card:nth-child(3n+3)::before { background: var(--cobalt); opacity: .14; border-radius: 50%; }
.idea-card:nth-child(4n+1)::after { content: ""; position: absolute; inset: 0 auto 0 0; width: 13px; background: repeating-linear-gradient(180deg, var(--ink) 0 22px, var(--cream) 22px 40px, var(--fuchsia) 40px 60px, var(--cream) 60px 78px, var(--teal) 78px 98px); opacity: .62; }
.idea-card.idea-featured { grid-column: span 2; min-height: 340px; background: linear-gradient(135deg, rgba(255,246,232,.94), rgba(54,191,164,.25)); }
.idea-card.idea-final { grid-column: span 2; }
.idea-card.idea-featured::before { width: 270px; height: 270px; border-radius: 64px; background: repeating-linear-gradient(90deg, rgba(255,143,154,.70) 0 22px, rgba(255,246,232,.72) 22px 42px, rgba(54,191,164,.55) 42px 64px, rgba(255,246,232,.72) 64px 84px); opacity: .62; }
.idea-card > * { position: relative; z-index: 1; }
.idea-card[hidden] { display: none; }
.idea-card-top { display: flex; width: 100%; justify-content: space-between; align-items: start; gap: 12px; margin-bottom: 34px; }
.idea-index { font-family: Alegreya, Georgia, serif; font-size: 2rem; font-weight: 700; line-height: .8; color: var(--fuchsia); }
.status-tag { display: inline-flex; padding: 8px 11px; border-radius: 999px; background: rgba(255,255,255,.66); color: var(--brown); font-size: .68rem; line-height: 1; font-weight: 900; text-transform: uppercase; letter-spacing: .09em; }
.status-open { background: var(--ink); color: white; }
.status-build { background: var(--chartreuse); color: var(--ink); }
.status-test { background: var(--cobalt); color: white; }
.status-creative { background: var(--coral); color: var(--ink); }
.status-play { background: var(--fuchsia); color: white; }
.status-format { background: var(--teal); color: var(--ink); }
.status-folded { background: var(--paper); color: var(--brown); }
.status-archive { background: var(--ink); color: rgba(255,255,255,.86); }
.idea-card h3 { max-width: 560px; font-family: Alegreya, Georgia, serif; font-size: clamp(2rem,3.1vw,3.15rem); line-height: .91; letter-spacing: -.06em; }
.idea-card p { max-width: 690px; }
.idea-card .idea-thesis { margin-bottom: 13px; color: var(--ink); font-family: Alegreya, Georgia, serif; font-size: clamp(1.18rem,1.65vw,1.43rem); line-height: 1.08; letter-spacing: -.035em; font-weight: 700; }
.idea-meta { display: grid; gap: 3px; max-width: 520px; margin-top: auto; padding-top: 24px; }
.idea-meta strong { color: var(--ink); font-size: .74rem; text-transform: uppercase; letter-spacing: .13em; }
.idea-meta span { color: var(--brown); line-height: 1.45; font-size: .95rem; }
.say-yes-section { display: block; margin-bottom: 58px; padding-top: clamp(28px,3vw,44px); padding-bottom: clamp(28px,3vw,44px); border-radius: 42px; background: var(--ink); color: white; }
.say-yes-section .eyebrow { color: var(--chartreuse); }
.say-yes-section h2 { color: white; }
.say-yes-section p { color: rgba(255,255,255,.80); }
.say-yes-copy > p:last-child { max-width: 540px; }
.say-yes-card { position: relative; overflow: hidden; width: 100%; max-width: 980px; margin: 0 auto; padding: clamp(32px,4vw,54px); border-radius: 30px; background: var(--chartreuse); color: var(--ink); }
.say-yes-card::before { content: ""; position: absolute; right: -66px; bottom: -86px; width: 220px; height: 220px; border-radius: 50%; background: var(--fuchsia); opacity: .44; }
.say-yes-card > * { position: relative; z-index: 1; }
.say-yes-big { margin-bottom: 32px; color: var(--ink) !important; font-family: Alegreya, Georgia, serif; font-size: clamp(2.6rem,5vw,5.2rem) !important; line-height: .88 !important; letter-spacing: -.06em !important; font-weight: 700 !important; }
.say-yes-card .action { background: var(--ink); color: white; box-shadow: none; }
.fine-print { max-width: 450px; margin: 24px 0 0; color: rgba(32,23,25,.68) !important; font-size: .82rem !important; line-height: 1.45 !important; }
@media (max-width: 980px) {
  .ideas-hero { grid-template-columns: 1fr; }
  .path-grid, .say-yes-section { grid-template-columns: 1fr; }
  .shelf-heading { align-items: start; flex-direction: column; }
  .idea-filters { justify-content: flex-start; }
  .idea-card.idea-featured { grid-column: span 1; }
  .idea-card.idea-final { grid-column: span 1; }
}
@media (max-width: 560px) {
  .idea-grid { grid-template-columns: 1fr; }
  .idea-card { min-height: 0; }
  .idea-card-top { margin-bottom: 27px; }
}

/* My Website */
.website-hero { display: grid; grid-template-columns: minmax(0, .78fr) minmax(420px, 1fr); gap: clamp(34px, 7vw, 92px); align-items: center; padding-bottom: clamp(48px, 7vw, 94px); }
.website-hero-copy { position: relative; z-index: 1; }
.website-hero h1 { max-width: 670px; }
.website-photo { position: relative; margin: 0; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 42px 26px 52px 30px; transform: rotate(1.5deg); box-shadow: 0 30px 90px rgba(32,23,25,.16); background: var(--ink); }
.website-photo::after { content: ""; position: absolute; inset: auto 18px 18px auto; width: 96px; height: 96px; border-radius: 26px; transform: rotate(10deg); background: var(--chartreuse); opacity: .78; mix-blend-mode: multiply; }
.website-photo img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: 50% 39%; }
.website-photo figcaption { position: absolute; z-index: 2; left: 18px; bottom: 18px; padding: 10px 14px; border-radius: 999px; color: var(--ink); background: var(--chartreuse); font-size: .76rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.website-story { padding-top: 0; }
.website-story > h2 { max-width: 860px; }
.website-story-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 42px; }
.website-story-card { position: relative; min-height: 380px; overflow: hidden; padding: clamp(25px, 3vw, 38px); border-radius: 34px; display: flex; flex-direction: column; background: var(--chartreuse); box-shadow: 0 22px 70px rgba(32,23,25,.08); }
.website-story-card::before { content: ""; position: absolute; right: -62px; bottom: -62px; width: 190px; height: 190px; border-radius: 50%; background: var(--fuchsia); opacity: .30; }
.website-story-card > * { position: relative; z-index: 1; }
.website-story-card span { margin-bottom: auto; color: var(--ink); font-family: Alegreya, Georgia, serif; font-size: 2.35rem; font-weight: 700; }
.website-story-card h3 { margin-top: 64px; font-family: Alegreya, Georgia, serif; font-size: clamp(2rem, 3vw, 3rem); line-height: .92; }
.website-story-card p { margin-bottom: 0; color: rgba(32,23,25,.78); }
.website-story-card.agent-card { color: white; background: var(--cobalt); }
.website-story-card.agent-card span, .website-story-card.agent-card p { color: rgba(255,255,255,.86); }
.website-story-card.agent-card::before { background: var(--chartreuse); opacity: .42; border-radius: 44px; transform: rotate(16deg); }
.website-story-card.loop-card { background: #d52d84; color: white; }
.website-story-card.loop-card span, .website-story-card.loop-card p { color: white; }
.website-story-card.loop-card::before { background: var(--teal); opacity: .58; border-radius: 54px 28px 54px 28px; transform: rotate(-14deg); }
.website-build { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .66fr); gap: clamp(36px, 8vw, 110px); align-items: start; }
.website-build-copy > h2 { max-width: 760px; }
.website-build-copy > p:not(.eyebrow) { max-width: 760px; }
.build-loop { margin: 32px 0 0; padding: 0; list-style: none; display: grid; gap: 12px; counter-reset: build-step; }
.build-loop li { counter-increment: build-step; position: relative; padding: 18px 20px 18px 64px; border-radius: 26px 34px 24px 30px; color: var(--brown); line-height: 1.55; background: rgba(255,255,255,.64); box-shadow: 0 14px 38px rgba(32,23,25,.05); }
.build-loop li::before { content: counter(build-step, decimal-leading-zero); position: absolute; left: 20px; top: 18px; color: var(--fuchsia); font-weight: 900; }
.build-loop strong { color: var(--ink); }
.website-pullquote { position: sticky; top: 32px; margin: 0; padding: clamp(28px, 4vw, 46px); border-radius: 34px 58px 34px 46px; color: var(--chartreuse); background: var(--ink); box-shadow: 0 28px 80px rgba(32,23,25,.12); }
.website-pullquote::after { content: ""; display: block; width: 90px; height: 18px; margin-top: 34px; border-radius: 999px; background: var(--fuchsia); }
.website-pullquote p { color: var(--chartreuse); font-family: Alegreya, Georgia, serif; font-size: clamp(2rem, 3.5vw, 3.55rem); line-height: .94; letter-spacing: -.05em; font-weight: 700; }
.website-pullquote span { color: var(--chartreuse); font-size: .76rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.website-closing { padding-bottom: clamp(70px, 9vw, 120px); }

/* Sitewide footer */
.site-footer { max-width: none; margin: 0; padding: clamp(48px, 7vw, 86px) clamp(22px, 4vw, 46px) 34px; color: var(--chartreuse); background: #050505; }
.site-footer-inner { width: 100%; max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: 250px minmax(0, 1fr) minmax(160px, .42fr); gap: clamp(30px, 5vw, 72px); align-items: start; }
.footer-portrait { width: 100%; margin: 0; aspect-ratio: 3 / 4; overflow: hidden; border-radius: 32px 52px 34px 42px; outline: 4px solid var(--chartreuse); outline-offset: 7px; transform: rotate(-2deg); background: var(--ink); }
.footer-portrait img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 44%; }
.footer-callout { padding-top: 4px; }
.footer-kicker { margin: 0 0 18px; color: var(--chartreuse) !important; font-size: .73rem !important; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.footer-callout h2 { max-width: 620px; margin-bottom: 18px; color: var(--chartreuse); font-size: clamp(2.5rem, 4.7vw, 5.1rem); line-height: .88; }
.site-footer .footer-callout > p:not(.footer-kicker) { max-width: 610px; margin-bottom: 28px; color: var(--chartreuse); font-size: clamp(1rem, 1.35vw, 1.15rem); }
.footer-connect { display: inline-flex; min-height: 50px; align-items: center; justify-content: center; padding: 13px 19px; border-radius: 999px; color: #050505; background: var(--chartreuse); font-weight: 900; text-decoration: none; }
.footer-connect:hover { text-decoration: none; transform: translateY(-2px); }
.footer-nav { display: grid; justify-content: stretch; gap: 10px; padding-top: 6px; font-size: .92rem; }
.footer-nav a { width: fit-content; color: var(--chartreuse); font-weight: 850; text-decoration: none; }
.footer-nav a:hover, .footer-nav a[aria-current="page"] { color: var(--chartreuse); text-decoration: underline; text-decoration-thickness: .14em; }
.footer-bottom { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 24px; align-items: end; margin-top: 16px; padding-top: 30px; }
.footer-brand { color: var(--chartreuse); font-family: Alegreya, Georgia, serif; font-size: clamp(1.65rem, 2.5vw, 2.4rem); font-weight: 700; letter-spacing: -.04em; text-decoration: none; }
.footer-brand em { font-style: italic; }
.site-footer .footer-bottom p { margin: 0; color: var(--chartreuse); font-size: .82rem; }
.site-footer a:focus-visible { outline: 4px solid var(--fuchsia); outline-offset: 5px; }

@media (max-width: 980px) {
  .website-hero, .website-build { grid-template-columns: 1fr; }
  .website-photo { max-width: 760px; }
  .website-story-grid { grid-template-columns: 1fr; }
  .website-story-card { min-height: 300px; }
  .website-pullquote { position: relative; top: auto; max-width: 720px; }
  .site-footer-inner { grid-template-columns: minmax(180px, 220px) minmax(0, 1fr); }
  .footer-nav { grid-column: 2; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .website-hero { padding-top: 42px; }
  .website-photo { aspect-ratio: 3 / 4; transform: rotate(.8deg); }
  .website-photo img { object-position: 50% 42%; }
  .website-story-card { min-height: 280px; }
  .website-story-card h3 { margin-top: 46px; }
  .website-pullquote p { font-size: clamp(2rem, 10vw, 3rem); }
  .site-footer { padding-left: 20px; padding-right: 20px; }
  .site-footer-inner { grid-template-columns: 1fr; }
  .footer-portrait { width: min(78vw, 310px); aspect-ratio: 3 / 4; }
  .footer-callout, .footer-nav, .footer-bottom { grid-column: 1; }
  .footer-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 10px; }
  .footer-bottom { align-items: flex-start; flex-direction: column; margin-top: 2px; }
}

/* Giving philosophy map: inspired by the supplied sketch, rebuilt as responsive HTML. */
.giving-hero { grid-template-columns: minmax(0, 1fr) minmax(330px, .92fr); align-items: start; }
.giving-hero-copy { grid-column: 1; grid-row: 1; padding-top: 0; }
.giving-philosophy-map { grid-column: 2; grid-row: 1; position: relative; min-height: 680px; padding: 0 0 24px; margin-top: 0; }
.philosophy-card { position: absolute; width: 88%; min-height: 154px; padding: 24px 28px; border-radius: 30px 46px 34px 42px; box-shadow: 0 18px 48px rgba(32,23,25,.08); z-index: 1; }
.philosophy-card span { display: block; margin-bottom: 12px; color: var(--fuchsia); font: 900 .72rem/1 Inter, sans-serif; letter-spacing: .12em; }
.philosophy-card h2 { margin: 0 0 10px; font-size: clamp(2rem, 3.1vw, 3rem); line-height: .86; }
.philosophy-card p { max-width: 380px; margin: 0; color: var(--brown); font-size: clamp(.96rem, 1.25vw, 1.08rem); line-height: 1.25; }
.philosophy-one { left: 0; top: 0; background: rgba(255,255,255,.72); }
.philosophy-two { right: 0; top: 236px; background: var(--chartreuse); }
.philosophy-two span { color: var(--ink); }
.philosophy-three { left: 0; top: 480px; background: rgba(54,191,164,.62); }
.philosophy-three span { color: var(--ink); }
.philosophy-arrow { position: absolute; width: 150px; height: 100px; overflow: visible; fill: none; stroke: var(--cobalt); stroke-width: 7; stroke-linecap: round; stroke-linejoin: round; z-index: 2; pointer-events: none; }
.philosophy-arrow .arrow-head { stroke-width: 6; }
.arrow-one { top: 150px; left: 42%; transform: rotate(10deg); }
.arrow-two { top: 390px; left: 22%; transform: rotate(-6deg); }
@media (max-width: 560px) {
  .philosophy-arrow { width: 118px; height: 78px; stroke-width: 6; }
  .philosophy-arrow .arrow-head { stroke-width: 5; }
  .arrow-one { top: 135px; left: 39%; transform: rotate(8deg); }
  .arrow-two { top: 340px; left: 12%; transform: rotate(-4deg); }
}
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 980px) {
  .giving-hero { grid-template-columns: 1fr; }
  .giving-hero-copy, .giving-philosophy-map { grid-column: 1; grid-row: auto; }
  .giving-philosophy-map { max-width: 620px; min-height: 680px; }
  .giving-hero-copy { padding-top: 18px; }
}
@media (max-width: 560px) {
  .giving-philosophy-map { min-height: 570px; }
  .philosophy-card { width: 90%; min-height: 124px; padding: 17px 19px; border-radius: 24px 34px 26px 32px; }
  .philosophy-card h2 { font-size: 1.7rem; }
  .philosophy-card p { font-size: .86rem; }
  .philosophy-one { top: 0; left: 0; }
  .philosophy-two { top: 195px; right: 0; }
  .philosophy-three { top: 395px; left: 0; }
  .philosophy-arrow { width: 110px; height: 70px; stroke-width: 5.5; }
  .philosophy-arrow .arrow-head { stroke-width: 5; }
  .arrow-one { top: 130px; left: 42%; transform: rotate(18deg); }
  .arrow-two { top: 328px; left: 24%; transform: rotate(-16deg); }
}