@import url('https://fonts.googleapis.com/css2?family=Allura&family=Cormorant:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400;1,500&family=Jost:wght@300;400;500;600&display=swap');
/* ───────────────────────────────────────────────
   The Garden Montessori — Color Tokens
   "Warm, floral, botanical, never stark." Built around
   the watercolor garden-door logos: one organization
   (moss green), four paths each with its own door color.
   Greens read at the org level; each path carries a
   signature hue sampled from its door + flowers.
   ─────────────────────────────────────────────── */

:root {
  /* ── Greens — moss & growth (ORG / umbrella primary) ──
     Sampled from the "The Garden" logo lettering, warmed a few
     degrees to meet the olive foliage in the botanical art. */
  --moss-deep:   #4F6132;   /* primary brand — headlines, buttons, nav, umbrella */
  --moss:        #7E8A5A;   /* warm sage — metadata, fine details      */
  --moss-tint:   #EAEDDB;   /* pale wash, nudged off the blue          */
  --door-umbrella: #A5B08E; /* umbrella door (sage green)              */

  /* ── Honey & wood — THE FARM SCHOOL (Carthage) ──
     Natural-wood gate, golden wildflowers. */
  --honey-deep:  #946B0A;   /* readable honey for text/links            */
  --honey:       #B8860B;   /* signature goldenrod (logo subtitle)      */
  --honey-soft:  #DCA365;   /* gate wood wash                           */
  --honey-tint:  #F1E6CD;   /* palest wheat field                       */

  /* ── Roses — dusty pink — THE GARDEN at MOORE (Southern Pines) ── */
  --rose-deep:   #A8625C;   /* readable rose for text/links             */
  --rose:        #C27A7A;   /* signature rose (logo subtitle)           */
  --rose-soft:   #EAC3BB;   /* gate pink wash                           */
  --petal:       #E8C8D2;   /* petal — soft fills                       */
  --rose-tint:   #F4E2DD;   /* palest rose field                        */

  /* ── Lavender — THE GARDEN PROGRESSIVE (Charlotte) ──
     Muted, grayed lavender — soft and dusty, never saturated. */
  --lavender-deep: #645E76; /* readable grayed lavender for text/links  */
  --lavender:      #8E87A0; /* signature dusty lavender (logo subtitle) */
  --lavender-soft: #CAC3D0; /* gate lavender wash (grayed)              */
  --lavender-mid:  #B7AFC2; /* mid lavender (grayed)                    */
  --lavender-tint: #EAE6EF; /* palest lavender field (grayed)           */

  /* ── Jade — TEACHER TRAINING / THE LAB SCHOOL ──
     Blue-green jade, sampled from the jade-flower sprig (hue ~192°).
     Deliberately bluer than the moss green so the two never read
     as the same family. */
  --jade-deep:   #3F7682;   /* readable jade for text/links             */
  --jade:        #5E94A0;   /* signature jade (logo subtitle)           */
  --jade-soft:   #9DC2C9;   /* gate jade wash                           */
  --jade-tint:   #DCEAEC;   /* palest jade field                        */

  /* ── Earth — bark & ink (text family) ── */
  --bark:        #695949;   /* body text, secondary headings            */
  --bark-lt:     #8A7868;   /* muted body, captions, italic sub         */
  --ink:         #382E28;   /* deepest text, footer ground              */

  /* ── Ivory papers — backgrounds ── */
  --ivory:       #F7F1E8;   /* primary page background (aged warm)      */
  --ivory-warm:  #EFE5D3;   /* section bands, quote strips, closings    */
  --ivory-deep:  #E5D8C2;   /* hairline borders on warm fields          */
  --paper:       #F5EEE0;   /* card surfaces, hero ground               */
  --cream-logo:  #FDF6F1;   /* matches the logo artwork ground — use as
                               the surface behind door tiles so the
                               square image edge disappears             */

  /* ─────────────────────────────────────────────
     SEMANTIC ALIASES — author against these
     ───────────────────────────────────────────── */

  /* text */
  --text-heading:  var(--moss-deep);
  --text-body:     var(--bark);
  --text-strong:   var(--ink);
  --text-muted:    var(--bark-lt);
  --text-accent:   var(--rose-deep);
  --text-on-dark:  var(--ivory);
  --text-on-dark-soft: rgba(247, 241, 232, 0.68);

  /* surfaces */
  --surface-page:   var(--ivory);
  --surface-band:   var(--ivory-warm);
  --surface-card:   var(--paper);
  --surface-tile:   var(--cream-logo);  /* door-tile ground            */
  --surface-invert: var(--moss-deep);   /* Lab School ground           */
  --surface-ink:    var(--ink);         /* footer                      */

  /* lines & accents */
  --border-hair:   rgba(150, 125, 100, 0.12);
  --border-soft:   var(--ivory-deep);
  --rule-accent:   var(--rose);

  /* interactive */
  --btn-bg:        var(--moss-deep);
  --btn-bg-hover:  #33492C;   /* deep moss — a real darken on hover, not a hue shift */
  --btn-fg:        var(--ivory);

  /* ── Per-path accent signatures ──
     One identity (moss), four paths each with its own door
     color. Use *-bright for fills / borders / door glows and
     the plain alias (deep) for text & links. */
  --accent-org:        var(--moss-deep);
  --accent-org-field:  var(--moss-tint);

  --accent-farm:        var(--honey-deep);   /* Farm School, Carthage  */
  --accent-farm-bright: var(--honey);
  --accent-farm-field:  var(--honey-tint);
  --accent-farm-door:   var(--honey-soft);

  --accent-pines:       var(--rose-deep);    /* Moore / Southern Pines */
  --accent-pines-bright:var(--rose);
  --accent-pines-field: var(--rose-tint);
  --accent-pines-door:  var(--rose-soft);

  --accent-charlotte:       var(--lavender-deep); /* Progressive / Charlotte */
  --accent-charlotte-bright:var(--lavender);
  --accent-charlotte-field: var(--lavender-tint);
  --accent-charlotte-door:  var(--lavender-soft);

  --accent-lab:        var(--jade-deep);     /* Teacher Training / Lab */
  --accent-lab-bright: var(--jade);
  --accent-lab-field:  var(--jade-tint);
  --accent-lab-door:   var(--jade-soft);
}

/* ───────────────────────────────────────────────
   The Garden Montessori — Typography Tokens
   Cormorant (display) · Allura (script accent) ·
   Jost Light (body / labels). Three voices, used with
   restraint. Cormorant is light & airy; Jost carries
   generous tracking; Allura appears once or twice a
   section — never in body, never long phrases.
   ─────────────────────────────────────────────── */

:root {
  /* ── Families ── */
  --font-display: 'Cormorant', 'Georgia', serif;
  --font-script:  'Allura', cursive;
  --font-body:    'Jost', system-ui, -apple-system, sans-serif;

  /* ── Logo wordmark ──
     The umbrella logo sets "The Garden" in THE SEASONS (a premium
     Nicky Laatz serif). It is NOT a free/CDN webfont, so it is not
     bundled here — drop the licensed .woff2 into tokens/fonts/ and add
     an @font-face for 'The Seasons' and this token renders correctly.
     Until then it falls back to Cormorant, the closest free match. */
  --font-logo:    'The Seasons', 'Cormorant', 'Georgia', serif;

  /* ── Display weights (kept light — never bold) ── */
  --weight-display-light:  300;
  --weight-display:        400;
  --weight-display-med:    500;

  /* ── Body weights (Jost Light is the default) ── */
  --weight-body-light:     300;
  --weight-body:           400;
  --weight-body-med:       500;

  /* ─────────────────────────────────────────────
     DISPLAY SCALE — Cormorant, fluid
     ───────────────────────────────────────────── */
  --display-hero:  clamp(3rem, 8vw, 6.8rem);    /* @kind font */ /* hero headline */
  --display-xl:    clamp(2.4rem, 5.5vw, 4rem);  /* @kind font */ /* page heroes */
  --display-lg:    clamp(2rem, 4.5vw, 3.2rem);  /* @kind font */ /* section H2 */
  --display-md:    1.65rem;                      /* card / panel title */
  --display-sm:    1.25rem;                      /* campus name        */

  --leading-display: 1.12;   /* tight for big serif                   */
  --leading-title:   1.25;

  /* ─────────────────────────────────────────────
     BODY SCALE — Jost
     ───────────────────────────────────────────── */
  --body-lg:   1.15rem;   /* hero sub / lead                          */
  --body-base: 1.05rem;   /* default paragraph                        */
  --body-sm:   0.97rem;   /* card copy                                */
  --body-xs:   0.69rem;   /* fine metadata                            */

  --leading-body:  1.95;  /* airy, unhurried                          */
  --leading-snug:  1.7;

  /* ─────────────────────────────────────────────
     UTILITY LABELS — Jost, all-caps, tracked out
     Eyebrows, tags, nav, small metadata.
     ───────────────────────────────────────────── */
  --label-size:     0.62rem;
  --label-size-sm:  0.58rem;
  --tracking-label: 0.24em;   /* range 0.26em–0.32em                  */
  --tracking-wide:  0.30em;
  --tracking-body:  0.005em;

  /* Label/eyebrow/nav weight — bumped off hairline 300 so tiny
     tracked uppercase labels stay legible on warm paper. */
  --weight-label:   500;

  /* ── Script accent sizing relative to host ── */
  --script-scale:  1.05em;    /* slightly larger than the serif beside it */
}

/* ───────────────────────────────────────────────
   The Garden Montessori — Spacing, Radii, Shadows
   "Generous white space — the page breathes." Sections
   are tall (8rem), rhythm is calm. Cards are mostly
   square; the leaf radius (18px 4px 18px 4px) is the
   one signature asymmetric corner, used sparingly.
   ─────────────────────────────────────────────── */

:root {
  /* ── Spacing scale ── */
  --space-1:  0.4rem;
  --space-2:  0.8rem;
  --space-3:  1.2rem;
  --space-4:  1.6rem;
  --space-5:  2.4rem;
  --space-6:  3.2rem;
  --space-7:  4rem;
  --space-8:  5.5rem;
  --space-9:  8rem;     /* the standard vertical section rhythm       */

  /* ── Section & gutter rhythm ── */
  --section-y:        8rem;     /* desktop section padding (block)     */
  --section-y-mobile: 5rem;
  --gutter:           5rem;     /* desktop horizontal page gutter      */
  --gutter-mobile:    1.8rem;
  --content-max:      1140px;   /* readable content column            */
  --content-wide:     1160px;   /* campus grid                        */

  /* ── Radii ──
     The page is mostly square-cornered & calm. The
     "leaf" radius is the signature asymmetric corner. */
  --radius-none:  0;
  --radius-sm:    4px;
  --radius-md:    10px;
  --radius-leaf:  10px;   /* gentle symmetric corner (doors, forms, cards) */
  --radius-pill:  999px;

  /* ── Shadows — soft, warm, low-contrast.
     Always tinted with the bark/ink hue, never gray. ── */
  --shadow-rest:  0 10px 30px rgba(55, 40, 30, 0.06);
  --shadow-card:  0 28px 64px rgba(55, 40, 30, 0.10);   /* card hover  */
  --shadow-press: 1.5px 2.5px 3px rgba(50, 32, 15, 0.22); /* pressed botanical */

  /* ── Motion — gentle, unhurried, no bounce ── */
  --ease-soft:   cubic-bezier(0.22, 1, 0.36, 1); /* @kind other */
  --reveal-dur:  0.85s;   /* @kind other */ /* scroll-reveal drift */
  --hover-dur:   0.3s; /* @kind other */
  --lift-card:   -6px;    /* card hover translateY                     */
}

@font-face{font-family:'The Seasons';src:local('The Seasons'),local('TheSeasons');font-weight:400;font-style:normal;font-display:swap}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ivory);color:var(--ink);overflow-x:hidden;font-family:var(--font-body)}
a{color:var(--moss-deep);transition:color .25s}a:hover{color:var(--rose-deep)}
img{max-width:100%}
.tgm-reveal{opacity:0;transform:translateY(18px);transition:opacity .85s ease,transform .85s ease}
.tgm-in{opacity:1;transform:none}
.tgm-mobilecta{display:none}
.tgm-bio.is-clamped{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.tgm-locbr{display:none}
.tgm-scrollcue{transition:opacity .4s ease}
.tgm-scrollcue span[aria-hidden]{animation:tgm-cue-drift 2.4s ease-in-out infinite}
.tgm-scrollcue:hover{opacity:.75}
.tgm-nav-top{transition:color .2s}.tgm-nav-top:hover{color:var(--moss-deep)!important}
.tgm-dropdown-item{transition:color .2s,background .2s}.tgm-dropdown-item:hover{color:var(--moss-deep)!important;background:rgba(75,96,69,.08)}
@keyframes tgm-cue-drift{0%,100%{transform:translateY(0);opacity:.75}50%{transform:translateY(6px);opacity:1}}
@keyframes tgmFade{from{opacity:0}to{opacity:1}}
@keyframes tgmRise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(max-width:1100px){.tgm-floral{display:none!important}}
@media(max-width:1160px){nav{padding:1rem 1.5rem!important}.tgm-navlinks{display:none!important}.tgm-mobileactions{display:flex!important}.tgm-mobilecta{display:block!important}}
@media(max-width:900px){.tgm-locbr{display:inline!important}.tgm-locdot{display:none!important}.tgm-twocol{grid-template-columns:1fr!important;gap:3rem!important}.tgm-campusgrid{grid-template-columns:1fr!important}.tgm-doorgrid{grid-template-columns:1fr 1fr!important}.tgm-methodgrid{grid-template-columns:1fr 1fr!important}.tgm-cards2{grid-template-columns:1fr!important}.tgm-teamgrid{grid-template-columns:1fr 1fr!important}.tgm-teamgrid>*{grid-column:auto!important}.tgm-footgrid{grid-template-columns:1fr 1fr!important;gap:2.4rem!important}section{padding-left:1.8rem!important;padding-right:1.8rem!important}}
@media(max-width:560px){.tgm-doorgrid{grid-template-columns:1fr!important}.tgm-methodgrid{grid-template-columns:1fr!important}.tgm-footgrid{grid-template-columns:1fr!important}.tgm-teamgrid{grid-template-columns:1fr!important}.tgm-formrow{grid-template-columns:1fr!important}}
@media(max-width:1150px){.tgm-teamgrid{grid-template-columns:1fr 1fr!important}.tgm-teamgrid>*{grid-column:auto!important}}
@media(prefers-reduced-motion:reduce){.tgm-reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}.tgm-scrollcue span[aria-hidden]{animation:none}.tgm-bee{display:none}}
@media(max-height:720px){.tgm-scrollcue{display:none!important}}
html,body{width:100%;max-width:100%;overflow-x:clip}
#root{position:relative;width:100%;min-width:0;overflow-x:clip}
.tgm-main-nav{width:100%;max-width:100vw}
.tgm-mobileactions{flex-shrink:0}
#tgm-mobile-menu{position:absolute;top:100%;left:0;right:0;z-index:299;background:var(--ivory);border-bottom:1px solid var(--border-hair);box-shadow:var(--shadow-card);max-height:calc(100dvh - 103px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-8px);transition:opacity .2s ease,transform .2s ease,visibility 0s .2s}
#tgm-mobile-menu.is-open{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0);transition:opacity .2s ease,transform .2s ease}
#tgm-mobile-menu a{overflow-wrap:anywhere}
body.tgm-menu-open{position:fixed;left:0;right:0;overflow:hidden}
.tgm-burger{position:relative;display:block!important}
.tgm-burger>span{position:absolute;left:8px;top:19px;width:24px!important;height:2px!important;transform-origin:center;transition:transform .2s ease,opacity .2s ease!important}
.tgm-burger>span:nth-child(1){transform:translateY(-7px)!important}
.tgm-burger>span:nth-child(2){transform:none!important}
.tgm-burger>span:nth-child(3){transform:translateY(7px)!important}
.tgm-burger[aria-expanded="true"]>span:nth-child(1){transform:rotate(45deg)!important}
.tgm-burger[aria-expanded="true"]>span:nth-child(2){opacity:0!important}
.tgm-burger[aria-expanded="true"]>span:nth-child(3){transform:rotate(-45deg)!important}
.tgm-dropdown{width:max-content;max-width:min(380px,calc(100vw - 32px))}
.tgm-dropdown-item{white-space:normal!important}
.tgm-dropdown-item:hover,.tgm-dropdown-item:focus-visible,#tgm-mobile-menu a:hover,#tgm-mobile-menu a:focus-visible{background:var(--moss-tint)!important;color:var(--moss-deep)!important}
.tgm-navlinks>li:focus-within>ul{opacity:1!important;visibility:visible!important;transform:none!important}
a:focus-visible,button:focus-visible,[role="button"]:focus-visible{outline:2px solid var(--moss-deep);outline-offset:3px}
.tgm-modal-bg>div{max-height:90dvh;overflow-y:auto}
@media(max-width:560px){.tgm-main-nav{gap:.5rem!important;padding:1rem!important}.tgm-main-nav>a{min-width:0;gap:.65rem!important}.tgm-main-nav>a>img{flex-shrink:0}.tgm-doorgrid{grid-template-columns:minmax(0,1fr)!important}.tgm-doorgrid>*{min-width:0}.tgm-footgrid{padding-left:1.8rem!important;padding-right:1.8rem!important}.tgm-modal-bg{padding:1rem!important}.tgm-modal-bg>div{padding:2.5rem 1.25rem 1.5rem!important}}
@media(min-width:1161px){#tgm-mobile-menu{display:none}}
@media(prefers-reduced-motion:reduce){#tgm-mobile-menu,.tgm-burger>span{transition:none!important}}