/* COLORS ONLY: green checker background + blue accents. Layout, photos and fonts are unchanged. Loaded after the original styles. */
:root,:root[data-theme="light"],:root[data-theme="dark"]{
  --bg:#f6f2e9;--line:#f6f2e9;--card:#f6f2e9;
  --sage:#f6f2e9;--sage-soft:#f6f2e9;--sage-deep:#171717;--on-deep:#f6f2e9;
  --blush:#f6f2e9;--lilac:#f6f2e9;--butter:#f6f2e9;--sky:#f6f2e9;
  --accent:#f6f2e9;--on-accent:#f6f2e9;color-scheme:light}
html{background:#f6f2e9}
body{background:#f6f2e9 url(green-checker.jpg) 0 0/810px 810px fixed;animation:gdrift 36s linear infinite}
@keyframes gdrift{to{background-position:810px 405px}}
.nav{background:rgba(233,242,225,.9)}
.btn{background:#f6f2e9;color:#f6f2e9;text-shadow:0 1px 3px rgba(35,64,95,.45);border-color:#f6f2e9;box-shadow:0 10px 22px rgba(91,136,185,.35);position:relative;overflow:hidden}
.btn.ghost{background:#f6f2e9;color:#171717;border-color:#f6f2e9}
.band{background:#f6f2e9;color:#f6f2e9}
.band h2,.band .big b,.band .lead,.band .big span,.band .sub-h{color:#f6f2e9;text-shadow:0 1px 3px rgba(35,64,95,.4)}
.band .eyebrow{background:rgba(255,255,255,.28);color:#f6f2e9;border-color:rgba(255,255,255,.6);text-shadow:0 1px 2px rgba(35,64,95,.4)}
.band em{color:#f6f2e9;background-image:linear-gradient(transparent 64%,rgba(255,255,255,.35) 64%)}
.hub-feature-top{background:#f6f2e9}
.join{background:#f6f2e9}
.hub-card .thumb,.hub-card .go,.mk-link .thumb,.mk-link .go{background:#f6f2e9;color:#f6f2e9;border-color:#f6f2e9}
.hub-card{background:rgba(255,255,255,.85)}
#theme{display:none}

/* ---------- gentle animations ---------- */
/* button shine sweep */
.btn::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.55) 50%,transparent 62%);background-size:260% 100%;background-position:160% 0;animation:gshine 6s ease-in-out 2s infinite}
@keyframes gshine{0%,55%{background-position:160% 0}100%{background-position:-60% 0}}
/* highlighted words sweep in when they appear */
em{background:linear-gradient(transparent 64%,#f6f2e9 64%) no-repeat 0 0/0% 100%;animation:ghl 1.1s ease .6s forwards}
@keyframes ghl{to{background-size:100% 100%}}
/* handwritten notes write themselves on */
.hand{clip-path:inset(0 100% 0 0);animation:gwrite 1.6s steps(24) 1.2s forwards}
@keyframes gwrite{to{clip-path:inset(0 0 0 0)}}
/* little arrows nudge, dots pulse */
.hub-card .go{animation:gnudge 1.8s ease-in-out infinite}
@keyframes gnudge{0%,100%{transform:translateX(0)}50%{transform:translateX(5px)}}
.pill .dot{animation:gpulse 2s ease-in-out infinite}
@keyframes gpulse{0%,100%{box-shadow:0 0 0 0 rgba(46,78,122,.45)}50%{box-shadow:0 0 0 7px rgba(46,78,122,0)}}
/* cards lift on hover / tap */
.card,.hub-card,.step{transition:transform .35s cubic-bezier(.34,1.56,.64,1),box-shadow .35s ease}
.card:hover,.hub-card:hover{transform:translateY(-5px);box-shadow:0 16px 28px rgba(46,78,122,.18)}
/* sparkles drifting up behind the content */
#gsparks{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.gsp{position:absolute;width:var(--s);height:var(--s);opacity:0;animation:gfloat var(--d) ease-in-out var(--dl) infinite}
.gsp svg{width:100%;height:100%;display:block;animation:gtw 2.4s ease-in-out var(--dl) infinite}
@keyframes gfloat{0%{transform:translateY(30px) rotate(0);opacity:0}15%{opacity:.9}85%{opacity:.9}100%{transform:translateY(-130px) rotate(160deg);opacity:0}}
@keyframes gtw{0%,100%{transform:scale(.8)}50%{transform:scale(1.25)}}
main,header,footer{position:relative;z-index:1}
@media (prefers-reduced-motion:reduce){body{animation:none}.btn::after,.hub-card .go,.pill .dot,.gsp{animation:none}em{animation:none;background-size:100% 100%}.hand{animation:none;clip-path:none}}

/* white words on blue: any text sitting on the blue gets a soft shadow so it stays readable */
.mk-link .txt b,.mk-link .txt small{color:var(--ink)}
.hub-feature-top{background:#f6f2e9}

/* dotted frames around photos, reels and the hero photo: light blue instead of green */
.gal figure,.reel .vid,.hub-feature-top img{border-color:#f6f2e9;box-shadow:0 8px 18px rgba(91,136,185,.22)}
.gal figure::after,.reel .vid::after{border-color:#f6f2e9}
.hub-feature-top img{box-shadow:0 12px 24px rgba(60,100,150,.3)}

/* bottom section: same blue as the analytics band, white words */
.join{background:#f6f2e9!important}
.join,.join h2,.join .lead,.join p,.join .hand,.join em{color:#f6f2e9!important;text-shadow:0 1px 3px rgba(35,64,95,.4)!important}
.join em{background-image:linear-gradient(transparent 64%,rgba(255,255,255,.35) 64%)}
.join .eyebrow{background:rgba(255,255,255,.28)!important;color:#f6f2e9!important;border-color:rgba(255,255,255,.6)!important;text-shadow:0 1px 2px rgba(35,64,95,.4)!important}
.join .btn{background:#f6f2e9!important;color:#171717!important;border-color:#f6f2e9!important;text-shadow:none!important}
/* footer sits on the green checker, so its words stay navy */
footer,footer *,footer a,footer span{color:#171717!important}