/* The Balanced Mom - shared stylesheet (served at /styles.css)
   Fonts are self-hosted from /assets/fonts (SIL OFL, licenses in fonts-license/). No external requests. */
@font-face{font-family:"Fraunces";src:url(/assets/fonts/fraunces-500-latin.woff2) format("woff2");font-weight:400 600;font-style:normal;font-display:swap}
@font-face{font-family:"Dancing Script";src:url(/assets/fonts/dancing-script-600-latin.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
:root{
  --cream:#fbf6ef;--paper:#fffdf9;--linen:#f3eadf;
  --blush:#f4dfd6;--rose:#d49384;--rose-dark:#a4574a;--rose-deep:#8c4639;
  --sage-light:#e4ebdc;--sage:#93a585;--sage-dark:#55684a;
  --gold-light:#f6e8c9;--gold:#d2a64f;--gold-dark:#7a5518;
  --ink:#3b3430;--muted:#6b625b;--line:#eadfd2;
  --serif:"Fraunces","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --script:"Dancing Script","Snell Roundhand","Segoe Script",cursive;
  --sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --shadow:0 18px 40px -26px rgba(92,62,48,.45);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--sans);background:var(--cream);color:var(--ink);line-height:1.65;display:flex;flex-direction:column;min-height:100vh;-webkit-font-smoothing:antialiased}
a{color:var(--rose-dark);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--ink)}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:8px}
img{max-width:100%;height:auto;border-radius:14px}
h1,h2,h3,.serif{font-family:var(--serif);font-weight:500;letter-spacing:-.01em;line-height:1.2}
.script{font-family:var(--script);font-weight:600;font-style:normal}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.6rem 1rem;z-index:10;border-radius:0 0 10px 0}
.skip:focus{left:0}

/* header (compact) */
.site-header{background:var(--paper);border-bottom:1px solid var(--line)}
.site-header .wrap{max-width:1080px;margin:0 auto;padding:.5rem 1.25rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.2rem 1rem}
.brand{text-decoration:none;color:var(--ink);font-family:var(--serif);font-size:1.22rem;letter-spacing:.005em}
.brand:hover{color:var(--rose-dark)}
.nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:.2rem}
.nav a{display:block;padding:.3rem .85rem;border-radius:999px;text-decoration:none;color:var(--ink);font-size:.93rem;transition:background .2s}
.nav a:hover{background:var(--linen);color:var(--ink)}
.nav a[aria-current="page"]{background:var(--blush);color:var(--rose-deep);font-weight:600}

/* hero: soft watercolor washes + a wavy bottom edge (all CSS) */
.hero{position:relative;text-align:center;padding:clamp(2.6rem,7vw,4.5rem) 1.5rem clamp(3rem,7vw,4.6rem);
  background:
    radial-gradient(38rem 20rem at 8% 10%,rgba(244,223,214,.95),transparent 70%),
    radial-gradient(30rem 18rem at 95% 20%,rgba(228,235,220,.95),transparent 70%),
    radial-gradient(26rem 14rem at 70% 105%,rgba(246,232,201,.85),transparent 70%),
    var(--cream)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:22px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 22' preserveAspectRatio='none'%3E%3Cpath d='M0 12c100-14 200 10 300 4s200-14 300-6 200 14 300 6 200-12 300-4v10H0z' fill='%23fbf6ef'/%3E%3C/svg%3E") center bottom/100% 100% no-repeat}
.eyebrow{text-transform:uppercase;letter-spacing:.2em;font-size:.76rem;color:var(--rose-dark);font-weight:700}
.hero h1{font-size:clamp(2.3rem,7vw,3.6rem);margin:.4rem 0 .5rem;color:var(--ink)}
.tagline{font-family:var(--serif);font-size:clamp(1.05rem,2.6vw,1.3rem);color:var(--muted);font-style:normal;max-width:38rem;margin:0 auto}
.tagline.script,.hero .tagline.script{font-family:var(--script);font-style:normal;color:var(--rose-dark);font-size:clamp(1.45rem,3.6vw,1.9rem);line-height:1.2}
.flourish{display:block;width:120px;height:14px;margin:.5rem auto 0;color:var(--gold)}
.divider{width:64px;height:2px;background:var(--gold);border:0;margin:2rem auto 0;border-radius:2px}
.actions{margin-top:1.4rem;display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center;align-items:center}

/* layout */
main{flex:1;width:100%}
.container{max-width:780px;margin:0 auto;padding:1rem 1.5rem 4rem}
.container.wide{max-width:1080px}
.card{position:relative;background:var(--paper);border:1px solid var(--line);border-radius:24px;padding:clamp(1.6rem,5vw,2.6rem);box-shadow:var(--shadow)}
.card+.card,.card+section,section+section{margin-top:2.4rem}
.center{text-align:center}
h2{font-size:clamp(1.5rem,3.4vw,1.85rem);color:var(--ink);margin-bottom:.7rem}
h3{font-size:1.25rem;color:var(--ink);margin-bottom:.35rem}
p{font-size:1.05rem}
p+p{margin-top:1rem}
.muted{color:var(--muted)}
.section-title{text-align:center;margin:3.2rem 0 1.5rem}
.section-title h2{margin:.25rem 0 0}
.section-title::after{content:"";display:block;width:90px;height:12px;margin:.6rem auto 0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 12'%3E%3Cpath d='M2 6c10-6 18 6 28 0s16-6 22 0 14 6 22 0 10-4 14 0' fill='none' stroke='%23d2a64f' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}

/* buttons + pills */
.btn{display:inline-flex;align-items:center;gap:.45rem;padding:.72rem 1.45rem;border-radius:999px;background:var(--rose-dark);color:#fff;text-decoration:none;font-weight:600;font-size:.98rem;letter-spacing:.01em;box-shadow:0 8px 18px -12px rgba(164,87,74,.9);transition:background .2s,transform .2s}
.btn:hover{background:#7a3a2f;color:#fff;transform:translateY(-1px)}
.btn.ghost{background:var(--paper);color:var(--sage-dark);border:1.5px solid var(--sage);box-shadow:none}
.btn.ghost:hover{background:var(--sage-light);color:var(--ink)}
.pill{display:inline-flex;align-items:center;gap:.55rem;padding:.6rem 1.15rem;border-radius:999px;background:var(--gold-light);color:var(--gold-dark);font-weight:700;font-size:.9rem;border:1px dashed var(--gold)}
.pill .dot{width:8px;height:8px;border-radius:50%;background:var(--gold);animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.35}50%{opacity:1}}

/* tiles */
.grid{display:grid;gap:1.2rem;grid-template-columns:1fr}
@media (min-width:720px){.grid{grid-template-columns:repeat(3,1fr)}}
.tile{--tint:var(--blush);--deep:var(--rose-dark);position:relative;overflow:hidden;display:flex;flex-direction:column;gap:.35rem;text-decoration:none;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:24px;padding:1.3rem 1.35rem 1.2rem;box-shadow:var(--shadow);transition:transform .25s ease,box-shadow .25s ease,border-color .25s}
.tile.t-sage{--tint:var(--sage-light);--deep:var(--sage-dark)}
.tile.t-gold{--tint:var(--gold-light);--deep:var(--gold-dark)}
.tile::before{content:"";position:absolute;right:-38px;top:-38px;width:120px;height:120px;border-radius:50%;background:var(--tint);opacity:.75;transition:transform .35s ease}
.tile>*{position:relative}
.tile:hover{transform:translateY(-4px);box-shadow:0 24px 44px -26px rgba(92,62,48,.55);border-color:var(--tint);color:var(--ink)}
.tile:hover::before{transform:scale(1.25)}
.tile .icon{width:46px;height:46px;border-radius:16px 16px 16px 6px;display:grid;place-items:center;background:var(--tint);color:var(--deep)}
.tile .icon svg{width:24px;height:24px}
.tile h3{margin:.25rem 0 0;font-size:1.3rem}
.tile p{font-size:.96rem;line-height:1.5;color:var(--muted)}
.tile .more{margin-top:auto;padding-top:.35rem;color:var(--deep);font-weight:700;font-size:.9rem}
.tile .more span{display:inline-block;transition:transform .25s}
.tile:hover .more span{transform:translateX(4px)}

/* home */
.hero.home{padding:clamp(1.5rem,4vw,2.4rem) 1.5rem clamp(2.2rem,4vw,2.8rem)}
.hero.home h1{font-size:clamp(2.1rem,5.4vw,3.1rem);margin:0}
.hero.home .tagline.script{margin-top:.1rem}
.hero .intro{max-width:46rem;margin:.9rem auto 0;background:rgba(255,253,249,.82);border:1px solid var(--line);border-radius:22px;padding:1rem 1.6rem;box-shadow:var(--shadow)}
.hero .intro p{font-size:1.02rem;line-height:1.6}
.home-main{padding-top:0}
.home-main .explore{margin-top:-.2rem}

/* spotlight */
.spotlight{display:grid;gap:clamp(1.4rem,4vw,3rem);align-items:center;grid-template-columns:1fr;margin-top:3.2rem;padding:clamp(1.6rem,4vw,2.8rem);border-radius:32px;
  background:radial-gradient(24rem 16rem at 0% 0%,rgba(255,253,249,.8),transparent 70%),linear-gradient(135deg,var(--blush),var(--gold-light));border:1px solid var(--line)}
@media (min-width:760px){.spotlight{grid-template-columns:minmax(220px,340px) 1fr}}
.spot-img{position:relative;display:block;max-width:300px;margin:0 auto;transform:rotate(-2.5deg);transition:transform .3s}
.spot-img:hover{transform:rotate(0)}
.spot-img img{display:block;border-radius:10px;box-shadow:0 22px 40px -22px rgba(92,62,48,.6);background:#fff}
.spot-img::before{content:"";position:absolute;z-index:1;top:-12px;left:50%;width:96px;height:26px;margin-left:-48px;background:rgba(147,165,133,.55);transform:rotate(3deg);border-radius:3px}
.spot-body h2{margin:.3rem 0 0;font-size:clamp(1.7rem,3.8vw,2.3rem)}
.spot-sub{color:var(--rose-deep);font-size:1.5rem;line-height:1.25;margin:.2rem 0 .8rem}
.spot-body .actions{justify-content:flex-start}

/* newest video */
.video-feature{display:grid;gap:clamp(1.2rem,4vw,2.4rem);align-items:center;grid-template-columns:1fr;margin-top:2.6rem;background:var(--paper);border:1px solid var(--line);border-radius:28px;padding:clamp(1rem,3vw,1.4rem);box-shadow:var(--shadow)}
@media (min-width:760px){.video-feature{grid-template-columns:1.1fr 1fr}}
.vf-thumb{position:relative;display:block;border-radius:20px;overflow:hidden;aspect-ratio:16/9;background:var(--linen)}
.vf-thumb img{display:block;width:100%;height:100%;object-fit:cover;border-radius:0;transition:transform .4s}
.vf-thumb:hover img{transform:scale(1.04)}
.play{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:rgba(255,253,249,.92) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6.5v11l9-5.5z' fill='%23a4574a'/%3E%3C/svg%3E") 55% 50%/30px no-repeat;box-shadow:0 10px 24px -10px rgba(0,0,0,.45)}
.vf-body{padding:.4rem clamp(.2rem,2vw,1rem) .8rem}
.vf-body h2{margin:.3rem 0 0;font-size:clamp(1.35rem,3vw,1.7rem)}
.vf-body time{display:block;margin-top:.2rem}
.vf-body .actions{justify-content:flex-start}

/* blog */
.post-list{list-style:none;display:grid;gap:1.2rem}
.post-item{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:1.4rem 1.6rem;box-shadow:var(--shadow)}
.post-item h2,.post-item h3{font-size:1.4rem;margin:.2rem 0 .4rem}
.post-item h2 a,.post-item h3 a{color:var(--ink);text-decoration:none}
.post-item h2 a:hover,.post-item h3 a:hover{color:var(--rose-dark);text-decoration:underline}
.post-item p{color:var(--muted);font-size:1rem}
.post-thumb{display:block;margin-bottom:.9rem}
.post-thumb img{width:100%;aspect-ratio:16/9;object-fit:cover}
time,.meta{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--sage-dark);font-weight:700}
.prose{font-size:1.08rem}
.prose>*+*{margin-top:1.1rem}
.prose h2{margin-top:2.2rem;font-size:1.6rem}
.prose h3{margin-top:1.8rem}
.prose ul,.prose ol{padding-left:1.4rem}
.prose li+li{margin-top:.35rem}
.prose li::marker{color:var(--rose)}
.prose blockquote{border-left:3px solid var(--rose);padding:.3rem 0 .3rem 1.2rem;font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-style:italic;font-size:1.2rem;color:var(--muted)}
.prose hr{border:0;height:2px;width:64px;background:var(--gold);margin:2.2rem auto}
.prose code{background:var(--linen);padding:.1rem .35rem;border-radius:6px;font-size:.92em}
.prose figure img{display:block;margin:0 auto}
.post-header{text-align:center;padding:clamp(2.4rem,7vw,4rem) 0 2rem}
.post-header h1{font-size:clamp(2rem,6vw,3rem);line-height:1.15;margin:.5rem 0 0}
.post-header .divider{margin-top:1.6rem}
.post-hero{margin-bottom:2rem}
.note+.prose,.note+.post-hero{margin-top:1.8rem}
.note{background:var(--gold-light);border:1px dashed var(--gold);border-radius:16px;padding:1rem 1.2rem;font-size:.95rem}
.back{display:inline-block;margin-top:2.4rem;font-weight:600}

/* curriculum */
.checklist{list-style:none;display:grid;gap:.8rem;margin-top:1rem}
.checklist li{display:flex;gap:.8rem;align-items:flex-start}
.checklist li::before{content:"";flex:none;width:22px;height:22px;margin-top:.2rem;border-radius:50%;background:var(--sage-light) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%2355684a' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
.split{display:grid;gap:1.2rem;grid-template-columns:1fr}
@media (min-width:720px){.split{grid-template-columns:1fr 1fr}}
.split>.card{margin-top:0}
.card.center p{max-width:40rem;margin-left:auto;margin-right:auto}
.gallery{list-style:none;padding:0;margin:0;display:grid;gap:1.6rem;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.gallery figure{position:relative;margin:0;background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:.9rem .9rem .7rem;height:100%;box-shadow:var(--shadow);transition:transform .25s}
.gallery li:nth-child(odd) figure{transform:rotate(-.8deg)}
.gallery li:nth-child(even) figure{transform:rotate(.8deg)}
.gallery figure:hover{transform:rotate(0) translateY(-3px)}
.gallery figure::before{content:"";position:absolute;z-index:1;top:-9px;left:50%;width:70px;height:20px;margin-left:-35px;border-radius:3px;background:rgba(212,147,132,.45);transform:rotate(-3deg)}
.gallery li:nth-child(3n+2) figure::before{background:rgba(147,165,133,.5)}
.gallery li:nth-child(3n) figure::before{background:rgba(210,166,79,.45)}
.gallery a{display:block}
.gallery img{display:block;width:100%;height:auto;border-radius:10px;box-shadow:0 1px 6px rgba(59,52,48,.12)}
.gallery figcaption{text-align:center;margin-top:.7rem;font-family:var(--serif);font-size:1.02rem}
.copyright-note{text-align:center;color:var(--muted);font-size:.9rem;margin:1.8rem 0 0}

/* channel */
.video{position:relative;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:var(--linen);margin-top:1rem}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-grid{list-style:none;display:grid;gap:1.2rem;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.video-card{display:block;text-decoration:none;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:20px;overflow:hidden;height:100%;box-shadow:var(--shadow);transition:transform .25s}
.video-card:hover{transform:translateY(-4px);color:var(--ink)}
.video-card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:0;background:var(--linen)}
.video-title{display:block;padding:.8rem 1rem 1rem;font-size:.95rem;line-height:1.4}
.card time{display:block;margin:.2rem 0 .3rem}

/* footer */
.site-footer{position:relative;margin-top:2rem;padding:3rem 1.5rem 2rem;text-align:center;color:var(--muted);font-size:.92rem;background:linear-gradient(180deg,var(--blush),#f1d6cb)}
.site-footer::before{content:"";position:absolute;left:0;right:0;top:-1px;height:22px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 22' preserveAspectRatio='none'%3E%3Cpath d='M0 10c100 14 200-10 300-4s200 14 300 6 200-14 300-6 200 12 300 4V0H0z' fill='%23fbf6ef'/%3E%3C/svg%3E") center top/100% 100% no-repeat}
.site-footer .brand{font-size:1.3rem}
.site-footer nav{margin:.6rem 0}
.site-footer nav a{margin:0 .55rem;color:var(--ink)}
.site-footer .social a{color:var(--rose-deep);font-weight:700}
.signoff{margin:1.1rem auto 0;color:var(--ink);font-size:.98rem}
.signoff .script{display:block;font-size:1.7rem;color:var(--rose-deep);line-height:1.3}
.site-footer .fine{margin-top:.8rem;font-size:.82rem;color:#6b5a52}

/* phones: keep the intro + three tiles above the fold */
@media (max-width:719px){
  .site-header .wrap{justify-content:center;padding:.4rem 1rem}
  .nav a{padding:.2rem .7rem}
  .hero.home{padding:.9rem 1.1rem 1.6rem}
  .hero.home h1{font-size:1.85rem}
  .tagline.script,.hero .tagline.script{font-size:1.35rem}
  .flourish{margin-top:.2rem;width:96px}
  .hero .intro{margin-top:.6rem;padding:.75rem 1rem;border-radius:18px}
  .hero .intro p{font-size:.94rem;line-height:1.5}
  .container{padding-left:1.1rem;padding-right:1.1rem}
  .tiles{gap:.6rem}
  .tiles .tile{display:grid;grid-template-columns:auto 1fr;column-gap:.85rem;row-gap:0;align-items:center;padding:.7rem .95rem;border-radius:18px}
  .tiles .tile::before{width:80px;height:80px;right:-30px;top:-30px}
  .tiles .tile .icon{grid-row:span 2;width:40px;height:40px;border-radius:14px 14px 14px 5px}
  .tiles .tile h3{margin:0;font-size:1.1rem;line-height:1.25}
  .tiles .tile p{font-size:.88rem;line-height:1.4}
  .tiles .tile .more{display:none}
  .spot-img{max-width:220px}
  .spot-body{text-align:center}
  .spot-body .actions,.vf-body .actions{justify-content:center}
  .vf-body{text-align:center}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.spotlight .eyebrow{color:var(--rose-deep)}