/* Activity detail pages use the existing APEBH palette and typography. */
:root{--c-green:#32a630;--c-green-dark:#268a24;--c-green-soft:#EAF0E8;--c-green-text:#2E7D32;--c-orange:#E07A3F;--c-ink:#2F3C4C;--c-muted:#5B6879;--c-line:#E1E6E3;--container:1200px;--gutter:clamp(1rem,3vw,2rem)}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;color:var(--c-ink);background:#fff;font:400 1rem/1.7 'Nunito Sans',system-ui,sans-serif}
h1,h2,h3{font-family:'Be Vietnam Pro','Nunito Sans',sans-serif;line-height:1.3}
a{color:var(--c-green-text);text-underline-offset:.2em}
a:hover{text-decoration-thickness:2px}
img{display:block;max-width:100%;height:auto}
button,summary{font:inherit}
:where(a,button,summary):focus-visible{outline:3px solid var(--c-orange);outline-offset:4px;border-radius:4px}
.container{width:min(100% - var(--gutter)*2,var(--container));margin-inline:auto}
.skip-link{position:fixed;left:1rem;top:-6rem;z-index:2000;background:#fff;padding:.7rem 1rem;border:2px solid var(--c-green-text);border-radius:8px}
.skip-link:focus{top:1rem}
.activity-hero{padding-block:clamp(1.5rem,3vw,2.75rem);background:linear-gradient(180deg,#fff,#F5FAF4)}
.breadcrumb{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none;padding:0;margin:0 0 1.6rem;color:var(--c-muted);font-size:.8rem}
.breadcrumb li+li::before{content:'›';margin-right:.4rem;color:var(--c-muted)}
.breadcrumb a{color:var(--c-muted)}
.article-heading{max-width:850px}
.article-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.55rem .8rem;font-size:.74rem;font-weight:800;letter-spacing:.045em;text-transform:uppercase}
.article-tag{padding:.3rem .7rem;border-radius:999px;background:var(--c-green-soft);color:var(--c-green-text)}
.article-title{margin:.85rem 0;font-size:clamp(1.7rem,2.2vw + .9rem,2.65rem);line-height:1.2;text-wrap:balance}
.article-lede{margin:0;font-family:'Be Vietnam Pro','Nunito Sans',sans-serif;font-size:clamp(1rem,.45vw + .88rem,1.14rem);line-height:1.75;color:var(--c-muted)}
.article-location{margin:.9rem 0 0;font-size:.88rem;font-weight:700}
.activity-cover{max-width:900px;margin:2rem auto 0}
.activity-cover img{width:100%;max-height:540px;object-fit:contain;border-radius:20px;background:var(--c-green-soft)}
figcaption{margin-top:.65rem;font-size:.8rem;line-height:1.55;color:var(--c-muted)}
.activity-cover figcaption{text-align:center}
.activity-notice{max-width:850px;margin:1.5rem 0 0;padding:1rem 1.2rem;border:1px solid #e6c4a4;border-left:4px solid #a34818;border-radius:8px;background:#fff6ee;color:#763916}
.activity-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:clamp(1.75rem,4vw,3.5rem);align-items:start;padding-block:clamp(2rem,4vw,3.5rem)}
.article-body{min-width:0;max-width:74ch;font-size:1.02rem;line-height:1.85}
.article-body section+section{margin-top:2.5rem}
.article-body h2{position:relative;margin:0 0 1rem;padding-left:1rem;font-size:clamp(1.2rem,.8vw + .95rem,1.55rem);scroll-margin-top:8rem}
.article-body h2::before{content:'';position:absolute;left:0;top:.2em;bottom:.2em;width:4px;border-radius:4px;background:var(--c-green)}
.article-body h3{font-size:1.03rem;margin:1.8rem 0 .7rem;scroll-margin-top:8rem}
.article-body p{margin:0 0 1rem}
.article-body ul{padding-left:1.3rem}
.article-body li{padding-left:.2rem;margin-block:.45rem}
.article-body li::marker{color:var(--c-green-text)}
.article-body figure{margin:1.5rem 0}
.article-body figure img{width:100%;border-radius:14px}
.article-body .body-photo{max-width:480px;margin:1.6rem auto}
.steps{padding-left:1.5rem}
.steps li{padding-left:.4rem;margin-bottom:1rem}
.article-aside{position:sticky;top:6.5rem;display:grid;gap:1rem}
.aside-card{border:1px solid var(--c-line);border-radius:14px;padding:1.2rem;background:#fff}
.aside-card h2{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--c-muted);margin:0 0 .8rem}
.aside-card dl{margin:0}
.aside-card dt{font-size:.74rem;color:var(--c-muted);margin-top:.8rem}
.aside-card dt:first-child{margin-top:0}
.aside-card dd{margin:.1rem 0 0;font-size:.88rem;font-weight:800;line-height:1.5}
.toc{padding-left:1.2rem;margin:0;font-size:.86rem}
.toc li{margin:.5rem 0;padding-left:.1rem}
.toc a{text-decoration:none;color:var(--c-ink)}
.toc a:hover{text-decoration:underline;color:var(--c-green-text)}
.article-sources{border-top:1px solid var(--c-line);padding-top:1.5rem;font-size:.86rem;color:var(--c-muted)}
.article-sources h2{font-size:1.05rem}
.related-section{background:#F5FAF4;padding-block:2.5rem}
.related-section h2{font-size:1.45rem;margin:0 0 1.2rem}
.related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.related-card{display:flex;flex-direction:column;gap:.5rem;padding:1.3rem;background:#fff;border:1px solid var(--c-line);border-radius:14px;color:var(--c-ink);text-decoration:none}
.related-card:hover{border-color:var(--c-green-text);box-shadow:0 4px 16px #2f3c4c0d}
.related-card span{font-size:.74rem;color:var(--c-muted)}
.related-card strong{font-family:'Be Vietnam Pro',sans-serif;font-size:.97rem;line-height:1.55}
.related-card em{margin-top:auto;font-size:.85rem;font-style:normal;font-weight:800;color:var(--c-green-text)}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.7rem 1.2rem;border-radius:999px;background:#267524;color:#fff;font-weight:800;text-decoration:none}
.btn:hover{background:#1f631d}
@media(max-width:980px){.activity-layout{grid-template-columns:1fr}.article-body{max-width:none}.article-aside{position:static;order:-1}.aside-toc{display:none}.aside-facts dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem 1rem}.aside-facts dt{margin:0}.aside-facts dd{margin-bottom:.6rem}.aside-facts dl>div{min-width:0}.related-grid{grid-template-columns:1fr}}
@media(max-width:600px){.article-title{font-size:1.75rem}.activity-cover img{border-radius:14px}.aside-facts dl{grid-template-columns:1fr}.article-body{font-size:.98rem}.breadcrumb{font-size:.74rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Keep space for the fixed global header while its fragment loads. */
.site-header-slot{min-height:76px}
.component-fallback{display:flex;align-items:center;flex-wrap:wrap;gap:.6rem 1.2rem;min-height:76px;padding-block:1rem;font-size:.9rem}
.component-fallback--footer{border-top:1px solid var(--c-line);padding-block:2rem}
.component-fallback p{margin:0}
@media(max-width:900px){.site-header-slot,.component-fallback{min-height:70px}}