/* Self-hosted font (Nunito, SIL OFL 1.1, see /static/fonts/OFL-Nunito.txt). One family for the whole site; no third-party requests. */
@font-face{font-family:"Nunito";font-style:normal;font-display:swap;font-weight:200 1000;src:url(/static/fonts/nunito-latin-ext.woff2?v=4fcdc09b70) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Nunito";font-style:normal;font-display:swap;font-weight:200 1000;src:url(/static/fonts/nunito-latin.woff2?v=76388dbfe3) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--font:"Nunito",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--g:#2f6b4f;--g2:#e8f1ec;--ink:#1d2a24;--mut:#5b6b63;--sun:#f4b942;--bg:#fbfaf6;--card:#fff;--r:14px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:16px;line-height:1.55;font-weight:400;color:var(--ink);background:var(--bg)}
button,input,select,textarea{font:inherit}
h1,h2,h3{font-family:var(--font);color:inherit}
a{color:var(--g)}
.top{position:sticky;top:0;z-index:5;background:#fff;border-bottom:1px solid #e6e3da;padding:.6rem 1rem;display:flex;flex-wrap:wrap;gap:.4rem 1rem;align-items:center;justify-content:space-between}
.brand{font-weight:800;font-size:1.2rem;text-decoration:none;color:var(--g)}
.top nav{display:flex;gap:.25rem;overflow-x:auto;white-space:nowrap;max-width:100%;-webkit-overflow-scrolling:touch}
.top nav a{padding:.35rem .6rem;border-radius:99px;text-decoration:none;font-size:.9rem;font-weight:600;color:var(--ink)}
.top nav a.on{background:var(--g2);color:var(--g)}
.top nav a.nl{background:var(--g);color:#fff}
.top nav a.lang{border:1px solid #d9d5c9}
main{max-width:1100px;margin:0 auto;padding:1rem}
h1{font-size:clamp(1.6rem,5vw,2.3rem);font-weight:800;line-height:1.15;letter-spacing:-.01em;margin:.6rem 0}
h2{font-size:clamp(1.25rem,4vw,1.5rem);font-weight:800;line-height:1.25;letter-spacing:-.01em;margin:1.8rem 0 .6rem}
h3{font-size:1.05rem;font-weight:700;line-height:1.3}
.hero{background:linear-gradient(135deg,#2f6b4f,#3f8a66);color:#fff;border-radius:var(--r);padding:1.6rem 1.2rem;margin-top:.5rem}
.hero p{max-width:60ch;opacity:.95}
.ctas{display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0}
.btn{display:inline-block;background:var(--sun);color:#1d2a24;font-size:1rem;font-weight:800;line-height:1.2;padding:.7rem 1.2rem;border-radius:99px;text-decoration:none}
.btn.ghost{background:transparent;color:#fff;border:2px solid #fff}
.stats{list-style:none;padding:0;margin:.5rem 0 0;display:flex;gap:1.2rem;flex-wrap:wrap}
.stats b{font-size:1.4rem;font-weight:800}
.grid{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.card{display:block;background:var(--card);border:1px solid #e6e3da;border-radius:var(--r);padding:.9rem 1rem;text-decoration:none;color:inherit;transition:box-shadow .15s}
a.card:hover{box-shadow:0 4px 14px rgba(0,0,0,.08)}
.card h3{font-size:1.05rem;font-weight:700;margin:.3rem 0;line-height:1.3}
.card h3 a{text-decoration:none;color:inherit}
.card[hidden]{display:none}
.loc{color:var(--mut);font-size:.9rem;margin:.2rem 0}
.facts{font-size:.9rem;margin:.3rem 0}
.tags{display:flex;flex-wrap:wrap;gap:.3rem;margin:.4rem 0 0;padding:0}
.tags span{background:var(--g2);color:var(--g);font-size:.78rem;font-weight:600;padding:.15rem .5rem;border-radius:99px}
.kind{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;font-weight:700;color:var(--mut)}
.k-playground{color:#b5651d}
.filters{display:flex;flex-wrap:wrap;gap:.5rem .8rem;align-items:flex-end;background:#fff;border:1px solid #e6e3da;border-radius:var(--r);padding:.8rem;position:sticky;top:3.2rem;z-index:4}
.filters label{display:flex;flex-direction:column;font-size:.8rem;color:var(--mut);gap:.15rem}
.filters label.chk{flex-direction:row;align-items:center;gap:.35rem;font-size:.9rem;color:var(--ink);padding:.4rem .2rem}
.filters select{font:inherit;font-size:.9rem;padding:.4rem;border-radius:8px;border:1px solid #cfcabc;background:#fff;min-width:9rem;color:var(--ink)}
.linkbtn{background:none;border:0;color:var(--g);text-decoration:underline;font:inherit;font-size:.9rem;cursor:pointer;padding:.4rem}
.count{color:var(--mut)}
.events{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.event{background:#fff;border-left:4px solid var(--sun);border-radius:10px;padding:.7rem .9rem;border-top:1px solid #eee;border-right:1px solid #eee;border-bottom:1px solid #eee}
.event h3{font-size:1.05rem;margin:.2rem 0}
.event .date{font-weight:800;color:var(--g);margin:0;font-size:.85rem}
.event .links{font-size:.85rem;margin:.3rem 0 0}
.src{color:var(--mut)}
.nlbox{background:#fff7e3;border:1px solid #f1dfae;border-radius:var(--r);padding:1.2rem;margin:2rem 0}
.nlbox h2{margin-top:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.detail{background:#fff;border:1px solid #e6e3da;border-radius:var(--r);padding:1.2rem}
.facts-table{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.6rem;margin:1rem 0}
.facts-table div{background:var(--g2);border-radius:10px;padding:.6rem .8rem}
.facts-table dt{font-size:.78rem;color:var(--mut)}
.facts-table dd{margin:0;font-weight:700;font-size:1.1rem}
.links{list-style:none;padding:0}
.links li{margin:.4rem 0;font-size:.9rem}
.featlist{columns:2 220px;padding-left:1.1rem}
.muted{color:var(--mut);font-size:.85rem}
footer{max-width:1100px;margin:2rem auto 0;padding:1rem;color:var(--mut);font-size:.85rem;border-top:1px solid #e6e3da}
@media (max-width:600px){.top{position:static}.top nav{flex-wrap:wrap;white-space:normal;overflow:visible}.filters{position:static}.filters select{min-width:0;width:100%}.filters label:not(.chk){flex:1 1 45%}}
.nlcta{margin:1rem 0 .6rem}
.nlcta .btn{padding:.8rem 1.5rem}
.nlprivacy{margin:0;color:var(--mut)}

/* ===== v4: photos, logo, warmer look ===== */
:root{--sh:0 6px 20px rgba(29,42,36,.10);--sh2:0 10px 28px rgba(29,42,36,.16);--cream:#fff8ea}
body{background:var(--bg)}
.top{padding:.45rem 1rem;box-shadow:0 1px 0 #e6e3da}
.brand{display:flex;align-items:center}
.brand img{height:35px;width:auto;display:block}
.sub{color:var(--mut);margin:-.3rem 0 .9rem;max-width:70ch}
.more{margin:.8rem 0 0;font-weight:600}
.more a,.back a{text-decoration:none}
img{max-width:100%}

/* hero */
.hero{position:relative;overflow:hidden;padding:0;min-height:clamp(440px,72vh,600px);display:flex;align-items:flex-end;background:#2f6b4f;border-radius:20px;margin-top:.6rem;box-shadow:var(--sh2)}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:30% 60%}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 25%,rgba(14,40,28,.55) 60%,rgba(14,40,28,.82) 100%)}
.hero-txt{position:relative;z-index:1;padding:1.4rem 1.2rem 2.4rem;color:#fff;max-width:720px}
.hero h1{font-size:clamp(1.9rem,7vw,3.1rem);font-weight:800;margin:.2rem 0 .5rem;text-shadow:0 2px 12px rgba(0,0,0,.35)}
.hero p{max-width:56ch;opacity:1;text-shadow:0 1px 8px rgba(0,0,0,.4)}
.kicker{display:inline-block;background:var(--sun);color:#1d2a24;font-weight:800;font-size:.8rem;padding:.2rem .65rem;border-radius:99px;margin:0;text-shadow:none!important}
.hero .btn{box-shadow:0 4px 14px rgba(0,0,0,.2)}
.hero .stats{font-size:.95rem}
.hero-cap{position:absolute;z-index:1;right:.7rem;bottom:.4rem;margin:0;font-size:.7rem;color:rgba(255,255,255,.85);text-shadow:0 1px 3px rgba(0,0,0,.6)}
.hero-cap a,.hero-cap .credit{color:inherit}

/* intro */
.intro{display:grid;gap:1rem 1.6rem;align-items:center;background:var(--cream);border:1px solid #f1e3bf;border-radius:20px;padding:1rem;margin:1.6rem 0}
.intro figure{margin:0}
.intro img{border-radius:14px;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block}
.intro figcaption{font-size:.7rem;color:var(--mut);margin-top:.25rem}
.intro h2{margin-top:0}
@media (min-width:700px){.intro{grid-template-columns:minmax(0,5fr) minmax(0,6fr);padding:1.2rem}}

/* photo cards */
.grid{gap:1rem;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.card.pcard{padding:0;overflow:hidden;border:0;border-radius:18px;box-shadow:var(--sh);transition:transform .15s,box-shadow .15s;display:flex;flex-direction:column}
.card.pcard:hover{transform:translateY(-2px);box-shadow:var(--sh2)}
.card.pcard[hidden]{display:none}
.ph{position:relative;display:block;aspect-ratio:3/2;background:#dfe9e3;overflow:hidden}
.ph img{width:100%;height:100%;object-fit:cover;display:block}
.ph .kind{position:absolute;left:.6rem;top:.6rem;background:rgba(255,255,255,.93);color:var(--g);padding:.15rem .55rem;border-radius:99px;font-size:.72rem}
.ph .kind.k-playground{color:#b5651d}
.ph .ill{position:absolute;right:.5rem;bottom:.45rem;background:rgba(0,0,0,.45);color:#fff;font-size:.62rem;padding:.08rem .45rem;border-radius:99px}
.ph .date{position:absolute;left:.6rem;top:.6rem;background:var(--sun);color:#1d2a24;font-weight:800;font-size:.85rem;padding:.2rem .6rem;border-radius:99px}
.cb{padding:.75rem .95rem 1rem;display:flex;flex-direction:column;gap:.1rem;flex:1}
.card.pcard h3{font-size:1.05rem;margin:.1rem 0 .15rem}
.tags{margin-top:.45rem}
.tags span{font-size:.78rem;padding:.18rem .55rem}
.tags .t-easy{background:#fff1cc;color:#7a5a00}
.tags .t-stroller{background:#e3f0ff;color:#24538a}
.tags .t-hut{background:#fbe7dc;color:#8a4120}
.event.pcard{border-left:0}
.event.pcard h3{font-size:1.05rem}
.event .links{margin-top:auto;padding-top:.3rem}

/* horizontal "top picks" strip */
.strip{display:grid;grid-auto-flow:column;grid-auto-columns:min(78%,290px);gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:.2rem .2rem 1rem;margin:0 -.2rem;-webkit-overflow-scrolling:touch}
.strip>.card{scroll-snap-align:start}

/* page photo headers */
.phead{position:relative;border-radius:20px;overflow:hidden;min-height:clamp(210px,34vw,330px);display:flex;align-items:flex-end;margin:.6rem 0 1rem;box-shadow:var(--sh)}
.phead img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.phead::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(14,40,28,.78))}
.phead-txt{position:relative;z-index:1;color:#fff;padding:1rem 1.1rem 1.5rem}
.phead h1{margin:0 0 .3rem;text-shadow:0 2px 10px rgba(0,0,0,.35)}
.phead p{margin:0;max-width:60ch;text-shadow:0 1px 6px rgba(0,0,0,.45)}
.phead .credit{position:absolute;z-index:1;right:.6rem;bottom:.35rem;font-size:.7rem;color:rgba(255,255,255,.85)}
.phead .credit a{color:inherit}

/* detail pages */
.detail{border:0;box-shadow:var(--sh);border-radius:20px}
.dphoto{margin:-1.2rem -1.2rem 1rem}
.dphoto img{width:100%;height:auto;aspect-ratio:3/2;max-height:460px;object-fit:cover;display:block;border-radius:20px 20px 0 0}
.dphoto figcaption{font-size:.7rem;color:var(--mut);padding:.35rem 1.2rem 0}
.dphoto figcaption a{color:inherit}
.about-photo{margin:0 0 1rem}.about-photo img{border-radius:18px}
.credit{font-size:inherit}
.back{margin:.4rem 0 .6rem}

/* credits list */
.credits{list-style:none;padding:0;display:grid;gap:.5rem;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.credits li{display:flex;gap:.6rem;align-items:center;font-size:.8rem;background:#fff;border-radius:12px;padding:.4rem;box-shadow:0 1px 4px rgba(0,0,0,.06)}
.credits img{width:96px;height:64px;object-fit:cover;border-radius:8px;flex:none}

/* newsletter + footer warmth */
.nlbox{background:linear-gradient(135deg,#fff7e3,#fdeec7);border:0;border-radius:20px;box-shadow:var(--sh);position:relative;overflow:hidden}
.nlbox::after{content:"";position:absolute;right:-20px;bottom:-26px;width:150px;height:98px;background:url(/static/logo-mark.svg?v=c0f9ae9c69) no-repeat center/contain;opacity:.16}
.flogo{margin:0 0 .4rem}.flogo img{display:block;height:44px;width:auto}
.filters{border:0;box-shadow:var(--sh);border-radius:16px}

@media (max-width:600px){
  main{padding:.7rem}
  .hero{border-radius:16px;min-height:520px}
  .hero-txt{padding:1.1rem 1rem 2.2rem}
  .top{justify-content:center}
  .brand img{height:32px}
  .grid{grid-template-columns:1fr}
  .dphoto{margin:-1.2rem -1.2rem .8rem}
}

/* hero v4.1: photo stays visible (child on the swing), text beside/below it */
.hero{display:block;min-height:0;background:#24543e}
.hero::after{display:none}
.hero-img{position:static;display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:18% 85%}
.hero-txt{padding:1.1rem 1.1rem 1.3rem;max-width:none}
.hero h1,.hero p{text-shadow:none}
.hero-cap{position:static;padding:0 1.1rem .7rem;color:rgba(255,255,255,.7)}
@media (min-width:800px){
  .hero{display:flex;align-items:center;justify-content:flex-end;min-height:540px}
  .hero-img{position:absolute;inset:0;height:100%;aspect-ratio:auto;object-position:50% 75%}
  .hero::after{display:block;background:linear-gradient(90deg,rgba(14,40,28,0) 30%,rgba(14,40,28,.55) 52%,rgba(14,40,28,.85) 100%)}
  .hero-txt{max-width:500px;padding:2rem 2.2rem 2.4rem}
  .hero h1,.hero p{text-shadow:0 2px 12px rgba(0,0,0,.35)}
  .hero-cap{position:absolute;left:.8rem;right:auto;bottom:.4rem;padding:0;color:rgba(255,255,255,.88);white-space:nowrap}
}
@media (max-width:600px){
  .top{padding:.4rem .5rem;gap:.2rem}
  .top nav{gap:.15rem;justify-content:center}
  .top nav a{font-size:.85rem;padding:.28rem .5rem}
}
.strip{align-items:start}

/* v5: "This weekend" block on the home page, right under the hero */
.wkend{background:#fff;border-radius:20px;box-shadow:var(--sh);padding:1.1rem 1.1rem 1.2rem;margin:1.2rem 0 1.6rem}
.wkend h2{margin:0 0 .15rem}
.wkend .sub{margin:0 0 .8rem}
.wklist{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.wklist li{display:grid;grid-template-columns:auto 1fr;gap:.15rem .8rem;align-items:start;padding:.65rem .75rem;border-radius:14px;background:var(--bg);border:1px solid #eee9dc}
.wkdate{grid-row:span 2;background:var(--sun);color:#1d2a24;font-weight:800;font-size:.85rem;line-height:1.25;padding:.3rem .6rem;border-radius:10px;text-align:center;min-width:4.6rem}
.wkdate small{display:block;font-size:.78rem;font-weight:700}
.wklist h3{margin:0;font-size:1.05rem}
.wklist h3 a{color:var(--ink);text-decoration:none}
.wklist h3 a:hover{text-decoration:underline}
.wkmeta{margin:0;color:var(--mut);font-size:.9rem}
.wkmeta .wkkind{display:inline-block;background:var(--g2);color:var(--g);font-size:.72rem;font-weight:700;padding:.05rem .45rem;border-radius:99px;margin-left:.3rem;vertical-align:1px}
.wkend .more{margin-top:.9rem}
.wkempty{margin:.2rem 0 0}
@media (min-width:800px){.wklist{grid-template-columns:1fr 1fr}}
.wkrange{font-weight:700;color:var(--mut);font-size:.8em}
.btn{border:2px solid transparent}
.btn.ghost{border-color:#fff}
.statlink{color:inherit;text-decoration:none;border-bottom:2px solid var(--sun)}
@media (max-width:600px){.hero-img{aspect-ratio:3/2}.hero-txt{padding:1rem 1rem 1.1rem}.wkend{padding:1rem .85rem 1.1rem;margin-top:1rem}.wklist li{padding:.6rem .65rem}}
.wklist li{align-content:start}

/* ===== v6: v4-style side-by-side layout, card grids, compact weekend cards, overflow-safe mobile ===== */
html,body{overflow-x:hidden}           /* last-resort guard: nothing may widen the page on phones */
@supports (overflow-x:clip){html,body{overflow-x:clip}}   /* clip keeps position:sticky working where supported */
img,video,svg{max-width:100%;height:auto}
main{width:100%}
/* hero: image left / text right from tablet width up (was 800px) */
@media (min-width:700px){
  .hero{display:flex;align-items:center;justify-content:flex-end;min-height:clamp(420px,52vw,540px)}
  .hero-img{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-position:50% 75%}
  .hero::after{display:block;background:linear-gradient(90deg,rgba(14,40,28,0) 30%,rgba(14,40,28,.55) 52%,rgba(14,40,28,.85) 100%)}
  .hero-txt{max-width:min(500px,58%);padding:2rem 2.2rem 2.4rem}
  .hero h1,.hero p{text-shadow:0 2px 12px rgba(0,0,0,.35)}
  .hero-cap{position:absolute;left:.8rem;right:auto;bottom:.4rem;padding:0;color:rgba(255,255,255,.88);white-space:nowrap}
}
/* "This weekend": compact grid of event cards (3 across desktop, 2 tablet, swipe row on phones) */
.wklist{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:.7rem}
.wklist li{display:flex;flex-direction:column;gap:.35rem;padding:.75rem .8rem .8rem;background:#fff;border:1px solid #eee9dc;border-radius:16px;box-shadow:0 2px 8px rgba(29,42,36,.06);min-width:0}
.wkdate{align-self:flex-start;min-width:0;text-align:left;display:inline-flex;gap:.4rem;align-items:baseline}
.wkdate small{display:inline}
.wklist h3{font-size:1rem;line-height:1.3;overflow-wrap:anywhere}
@media (min-width:800px){.wklist{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:599px){
  .wklist{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:min(78%,260px);overflow-x:auto;scroll-snap-type:x mandatory;padding:.1rem .1rem .6rem;-webkit-overflow-scrolling:touch}
  .wklist li{scroll-snap-align:start}
}
/* top picks: swipe row on phones, a proper grid from tablet up */
@media (min-width:700px){.strip{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));overflow:visible;scroll-snap-type:none}}
/* card grids: 2 across on phones instead of one long list */
@media (max-width:599px){
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
  .grid .cb{padding:.55rem .6rem .7rem}
  .grid .card.pcard h3{font-size:.92rem}
  .grid .loc,.grid .facts{font-size:.78rem}
  .grid .tags span{font-size:.68rem;padding:.12rem .4rem}
  .grid .ph .kind{font-size:.62rem;left:.4rem;top:.4rem}
  .grid .ph .ill{display:none}
}
@media (max-width:340px){.grid{grid-template-columns:1fr}}
.card,.cb,.wklist li{overflow-wrap:break-word}
/* "Made by a mum": small box near the bottom */
.intro.mini{grid-template-columns:96px minmax(0,1fr);gap:.4rem .9rem;align-items:start;padding:.8rem;margin:1.6rem 0 1rem}
.intro.mini img{aspect-ratio:1/1;border-radius:12px}
.intro.mini figcaption{font-size:.6rem;line-height:1.2}
.intro.mini h2{font-size:1.05rem;margin:0 0 .2rem}
.intro.mini p{font-size:.9rem;margin:.1rem 0}
.intro.mini .more{margin-top:.3rem}
@media (min-width:700px){.intro.mini{grid-template-columns:150px minmax(0,1fr);padding:1rem}}
/* old engines without aspect-ratio (iOS < 15): keep photo boxes from collapsing */
@supports not (aspect-ratio:1/1){.ph{height:0;padding-top:66.6%}.ph img{position:absolute;inset:0}.hero-img{max-height:70vw}}
@media (min-width:700px){.strip,.grid.g3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:900px){.strip,.grid.g3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.dphoto.about-photo{margin:0 0 1rem}.dphoto.about-photo img{border-radius:18px}