:root{
  --green:#2f5a2d; /* exact logo green; kept in hex so the raster assets match */
  --green-deep:#244a23;
  --ink:#1b3519;
  --ink-soft:#456543;
  --cream:#fffada; /* exact logo cream; the flattened illustrations use the same value */
  --cream-deep:#f5eec2;
  --rule:rgba(47,90,45,.22);
  --rule-strong:rgba(47,90,45,.45);
  --cream-line:rgba(255,250,218,.28);
  --focus:#1d4ed8;

  --font:'Rubik',system-ui,-apple-system,'Segoe UI',sans-serif;
  --text-sm:0.85rem;
  --text-body:1.0625rem;
  --text-lg:1.35rem;
  --text-h1:clamp(1.85rem,6vw,2.6rem);

  --space-xs:0.5rem;
  --space-sm:0.75rem;
  --space-md:1.25rem;
  --space-lg:2rem;
  --space-xl:3rem;

  --measure:62ch;
  --radius:14px;
  --z-head:20;
  --z-bar:30;
  --z-drawer:40;
  --ease-out:cubic-bezier(.22,1,.36,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--cream);color:var(--ink);font-family:var(--font);
  font-size:var(--text-body);line-height:1.6;font-kerning:normal;
  text-rendering:optimizeLegibility;overflow-x:hidden;
}
a{color:var(--green);text-decoration-thickness:1.5px;text-underline-offset:.16em}
a:hover{color:var(--green-deep)}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:6px}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{text-wrap:balance;line-height:1.2;color:var(--ink)}
p{text-wrap:pretty}
strong{font-weight:500}

.wrap{width:min(100% - 2.5rem, 44rem);margin-inline:auto}

/* ---------- green masthead: app bar + page title in one block ---------- */
.mast{background:var(--green);color:var(--cream)}
.mast .bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:4rem;border-bottom:1px solid var(--cream-line)}
.mast .home{display:inline-flex;align-items:center;min-height:44px}
.mast .home img{height:2.6rem;width:auto}
.mast .nav{display:flex;gap:.25rem}
.mast .nav a{
  display:inline-flex;align-items:center;min-height:44px;padding:.4rem .55rem;
  color:var(--cream);opacity:.82;text-decoration:none;font-weight:500;
  border-bottom:2px solid transparent;transition:opacity .18s var(--ease-out);
}
.mast .nav a:hover{opacity:1;color:var(--cream)}
.mast .nav a[aria-current="page"]{opacity:1;border-bottom-color:var(--cream)}
.mast .intro{padding:var(--space-lg) 0 calc(var(--space-lg) + .25rem)}
.mast h1{color:var(--cream);font-size:var(--text-h1);font-weight:700;letter-spacing:-.015em}
.mast .facts{margin-top:.55rem;max-width:44ch;line-height:1.5;color:var(--cream);opacity:.93}
.mast .facts b{font-weight:700}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:48px;
  padding:.7rem 1.25rem;border-radius:999px;font-weight:500;font-size:var(--text-body);
  text-decoration:none;border:2px solid var(--green);
  transition:background .18s var(--ease-out),color .18s var(--ease-out),transform .18s var(--ease-out);
}
.btn svg{width:20px;height:20px;flex:none}
.btn.green{background:var(--green);color:var(--cream)}
.btn.green:hover{background:var(--green-deep);color:var(--cream);transform:translateY(-1px)}
.btn.outline{background:transparent;color:var(--green)}
.btn.outline:hover{background:rgba(47,90,45,.08);color:var(--green-deep)}

main{padding:var(--space-lg) 0 var(--space-xl)}

/* ---------- cluster blocks: light cards, the timetable is the hero ---------- */
.cluster{margin-bottom:var(--space-xl)}
.cluster > h2{font-size:var(--text-lg);font-weight:700;padding-bottom:.5rem;border-bottom:2.5px solid var(--green)}
.cluster .where{list-style:none;margin:.85rem 0 .35rem;display:grid;gap:.7rem}
.cluster .where li{display:grid;grid-template-columns:1fr auto;gap:.1rem .85rem;align-items:center}
.cluster .where b{font-weight:700}
.cluster .where .a{grid-column:1;color:var(--ink-soft);font-size:var(--text-sm)}
.cluster .where .pill{
  grid-column:2;grid-row:1/3;display:inline-flex;align-items:center;gap:.35rem;
  min-height:40px;padding:.35rem .8rem;border-radius:999px;border:1.5px solid var(--green);
  color:var(--green);font-weight:500;font-size:var(--text-sm);text-decoration:none;white-space:nowrap;
  transition:background .18s var(--ease-out);
}
.cluster .where .pill:hover{background:rgba(47,90,45,.08)}
.cluster .where .pill svg{width:15px;height:15px}
.cluster .sign{font-size:var(--text-sm);color:var(--ink-soft);background:var(--cream-deep);border-radius:9px;padding:.5rem .75rem;margin:.4rem 0 .2rem}
.cluster table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;margin-top:.5rem}
.cluster td{padding:.8rem .6rem .8rem 0;border-bottom:1px solid var(--rule);vertical-align:middle}
.cluster tr:last-child td{border-bottom:none}
.cluster td.d{width:4.2rem;padding-right:.4rem}
.cluster td.t{width:4.3rem;font-weight:700;font-size:1.15rem;white-space:nowrap}
.cluster td .two{display:block;font-size:var(--text-sm);color:var(--ink-soft)}
.day{
  display:inline-flex;align-items:center;justify-content:center;min-width:3.1rem;padding:.26rem .5rem;
  border-radius:999px;background:var(--green);color:var(--cream);font-weight:700;font-size:var(--text-sm);letter-spacing:.05em;
}
.note{font-size:var(--text-sm);color:var(--ink-soft);max-width:var(--measure)}

/* ---------- rules ---------- */
.short{background:var(--cream-deep);border-radius:var(--radius);padding:var(--space-md);margin:0 0 var(--space-xl)}
.short h2{font-size:var(--text-lg);margin-bottom:var(--space-sm);color:var(--green-deep)}
.short ul{list-style:none}
.short li{position:relative;padding-left:1.4rem;margin-bottom:.5rem;line-height:1.5}
.short li::before{content:"";position:absolute;left:0;top:.6em;width:.55rem;height:.55rem;border-radius:50%;background:var(--green)}
.short li:last-child{margin-bottom:0}
.rule{max-width:var(--measure);padding:var(--space-md) 0 var(--space-lg)}
.rule + .rule{border-top:1px solid var(--rule)}
.rule h2{font-size:var(--text-lg);font-weight:700;margin-bottom:.5rem}
.rule p + p{margin-top:.5rem}
.rule .ex{margin-top:.7rem;padding:.6rem .85rem;background:var(--cream-deep);border-radius:10px;font-size:var(--text-sm)}

/* ---------- green footer bookend ---------- */
footer{background:var(--green);color:var(--cream);padding:var(--space-lg) 0 calc(var(--space-lg) + 4.2rem)}
.foot{display:grid;gap:var(--space-lg);grid-template-columns:1fr}
.foot .k{font-size:var(--text-sm);opacity:.8;margin-bottom:.3rem}
.foot nav{display:flex;flex-direction:column}
.foot a{color:var(--cream);font-weight:500;text-decoration:none;display:inline-block;padding:.3rem 0}
.foot a:hover{text-decoration:underline;color:var(--cream)}
.foot nav a[aria-current="page"]{opacity:.65;pointer-events:none}
.foot .c{display:flex;flex-direction:column}
.foot .meta{grid-column:1/-1;font-size:var(--text-sm);opacity:.75;border-top:1px solid var(--cream-line);padding-top:var(--space-sm)}
@media (min-width:640px){
  .foot{grid-template-columns:auto 1fr}
  footer{padding-bottom:var(--space-lg)}
}

/* ---------- fixed WhatsApp bar ---------- */
.cta-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:var(--z-bar);
  padding:.6rem 1rem calc(.6rem + env(safe-area-inset-bottom));
  background:var(--cream);border-top:1px solid var(--rule);display:flex;justify-content:center;
  transition:transform .3s var(--ease-out);
}
.cta-bar.hidden{transform:translateY(110%)}
.cta-bar .btn{width:min(100%,24rem)}
@media (min-width:760px){.cta-bar{display:none}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0ms!important;transition-duration:.01ms!important}
}

/* ---------- generated schedule page extras ---------- */
.offday{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .6rem;margin:0 0 var(--space-lg);font-size:var(--text-sm);color:var(--ink-soft)}
.offday .day{background:transparent;color:var(--ink-soft);border:1.5px solid var(--rule-strong)}
.draft-banner{background:#b45309;color:#fff;font-size:var(--text-sm);font-weight:500;text-align:center;padding:.55rem 1rem}
.draft-banner a{color:#fff}
