/* Growth artwork: the growing tree, the class-by-class growth chart and tree stages.
   Colours follow the active palette; the earth itself keeps natural tones in every palette. */
:root,[data-palette="teal"]{--art-leaf-1:#006c73;--art-leaf-2:#1e8c88;--art-leaf-3:#5ab8ad;--art-leaf-4:#0a4f57;--art-bloom-1:#e5508f;--art-bloom-2:#f49ac0;--art-bloom-3:#e99a50;--art-trunk:#3a2c26;--art-wall:#fff0de;--art-ruler:#ffd3a7;--art-ruler-edge:#dea06a;--art-sun:#ffe3c4;--art-bloom-4:#7a5ce0}

/* Third priority card and three-up grids */
.priority-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.priority-grid.three .priority-card:nth-child(3){background:var(--card-three)}
.callout-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}

/* We take from the earth. We give back. */
.give-back{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:5vw;align-items:center}
.give-copy{min-width:0}
.give-copy h2{margin-bottom:24px}
.give-copy h2 em{font-style:normal;color:var(--purple);position:relative;display:inline-block}
.give-copy h2 em:after{content:'';position:absolute;left:0;right:0;bottom:2px;height:7px;background:var(--yellow);transform:rotate(-1deg);z-index:-1}
.give-copy>p{max-width:520px;margin-bottom:28px}
.give-legend{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:16px;max-width:520px}
.give-legend li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;align-items:start;font-size:14px;color:var(--muted)}
.give-legend strong{display:block;color:var(--ink);font:800 20px/1.1 var(--display);letter-spacing:-.03em;margin-bottom:3px}
.give-legend i{width:16px;height:16px;border-radius:50%;margin-top:3px;display:block}
.lg-root{background:#f3d2b6;box-shadow:inset 0 0 0 2px #8a5a45}
.lg-bloom{background:var(--art-bloom-1)}
.lg-leaf{background:var(--art-leaf-1)}
.regrow{background:none;border:0;padding:8px 0;color:var(--ink);font:700 12px var(--body);border-bottom:1px solid currentColor;cursor:pointer;min-height:40px}
.give-art{position:relative;margin:0;min-width:0}
.give-art canvas{display:block;width:100%;height:auto;aspect-ratio:1000/1060}
.give-tag{position:absolute;font:700 10px/1.2 var(--body);letter-spacing:.12em;text-transform:uppercase;padding:8px 12px;border-radius:30px;white-space:nowrap;pointer-events:none}
.give-tag-top{left:1%;top:9%;background:#fff;color:var(--ink);box-shadow:0 3px 14px #0000001c}
.give-tag-bottom{left:50%;top:89.6%;transform:translateX(-50%);color:#fde3cc}

/* Growing up, one class at a time */
.growing{background:var(--pink)}
.growing-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6vw;align-items:center}
.growing-copy{min-width:0}
.growing-copy h2{margin-bottom:24px}
.growing-copy>p{max-width:520px;margin-bottom:22px}
.class-steps{list-style:none;padding:0;margin:6px 0 30px;display:flex;flex-wrap:wrap;gap:8px}
.class-steps li{font:700 12px var(--body);padding:8px 13px;border-radius:30px;background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.growth-chart{margin:0;background:var(--art-wall);border-radius:20px;padding:16px 16px 8px;min-width:0}
.growth-chart svg{display:block;width:100%;height:auto;overflow:visible}
.growth-chart figcaption{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;font-size:11px;color:var(--muted);padding:6px 8px 4px}
.gc-wall-line{stroke:var(--art-ruler-edge);stroke-width:2}
.gc-ruler{fill:var(--art-ruler);stroke:var(--art-ruler-edge);stroke-width:1.5}
.gc-tick{stroke:var(--ink);opacity:.55}
.gc-num{font:700 11px var(--body);fill:var(--ink);opacity:.72}
.gc-unit{font:700 10px var(--body);fill:var(--ink);opacity:.6;letter-spacing:.08em}
.gc-mark{stroke:var(--ink);stroke-width:2.2;stroke-linecap:round}
.gc-guide{stroke:var(--ink);stroke-width:1.2;stroke-dasharray:2 5;opacity:.45}
.gc-label{font:800 20px var(--display);letter-spacing:-.03em;fill:var(--ink)}
.gc-age{font:500 12px var(--body);fill:var(--muted)}
.gc-stem{fill:none;stroke:var(--art-trunk);stroke-width:4.5;stroke-linecap:round;stroke-dasharray:var(--len) var(--len);stroke-dashoffset:0}
.gc-pop{transform-box:fill-box}
.gc-leaf{transform-origin:0% 50%}
.gc-flower{transform-origin:50% 50%}
.gc-dot{transform-origin:50% 50%}
.gc-pot{fill:#c46e3c}.gc-rim{fill:#d98552}.gc-soil{fill:#5b3a2e}
.growth-chart.is-armed .gc-stem{stroke-dashoffset:var(--len)}
.growth-chart.is-armed .gc-pop{transform:scale(0)}
.growth-chart.is-armed .gc-label{fill:var(--muted)}
.growth-chart.is-growing .gc-stem{animation:gc-draw var(--dur) linear both}
.growth-chart.is-growing .gc-pop{animation:gc-pop .75s cubic-bezier(.3,1.55,.5,1) both;animation-delay:var(--d)}
.growth-chart.is-growing .gc-label{animation:gc-ink .5s ease both;animation-delay:var(--d)}
@keyframes gc-draw{from{stroke-dashoffset:var(--len)}to{stroke-dashoffset:0}}
@keyframes gc-pop{from{transform:scale(0)}to{transform:scale(1)}}
@keyframes gc-ink{from{fill:var(--muted)}to{fill:var(--ink)}}

/* Trees page */
.stages{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.stages li{min-width:0}
.stage-frame{border-radius:16px;overflow:hidden;background:linear-gradient(180deg,var(--pink) 0%,var(--lilac) 85%);margin-bottom:16px}
.stage-frame canvas{display:block;width:100%;height:auto;aspect-ratio:400/440}
.stages h3{font-size:26px;margin-bottom:8px}
.stages p{font-size:14px}
.species-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.species-card{background:var(--lilac);border-radius:16px;padding:24px}
.species-card:nth-child(3n+2){background:var(--card-two)}
.species-card:nth-child(3n){background:var(--card-three)}
.species-card h3{font-size:28px;margin-bottom:10px}
.species-card p{font-size:14px}

@media(max-width:1100px){.priority-grid.three{grid-template-columns:1fr 1fr}.priority-grid.three .priority-card:nth-child(3){grid-column:1/-1}.callout-grid.four{grid-template-columns:1fr 1fr}.theme-grid{grid-template-columns:1fr 1fr}}
@media(max-width:850px){.give-back,.growing-grid{grid-template-columns:1fr;gap:40px}.stages{grid-template-columns:1fr 1fr}.species-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.priority-grid.three{grid-template-columns:1fr}.priority-grid.three .priority-card:nth-child(3){grid-column:auto}.callout-grid.four{grid-template-columns:1fr}.species-grid{grid-template-columns:1fr}.give-tag{font-size:9px;padding:6px 10px}.give-tag-top{top:0;left:0}.give-legend strong{font-size:18px}.stages h3{font-size:22px}.gc-label{font-size:21px}.theme-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.growth-chart .gc-stem{animation:none!important;stroke-dashoffset:0!important}.growth-chart .gc-pop{animation:none!important;transform:none!important}.growth-chart .gc-label{animation:none!important;fill:var(--ink)!important}}
/* Violet accent */
.gc-guide{stroke:var(--violet,#5730c7);opacity:.6}
.class-steps li{box-shadow:inset 0 0 0 1.5px var(--violet-soft,#e9e3fb)}