/* Living Group Pages: newsletter-inspired styling (white page on grey,
   artwork banner, coloured section bands, bold blue links). */
:root{
  --bg:#e6e6e6; --page:#ffffff; --text:#2b2b2b; --muted:#5a5f66; --line:#dedede;
  --link:#1a62d6; --title:#24479a;
  --green:#d3ebb0; --aqua:#c4f3ee; --cream:#fdf3dc; --lavender:#e6e3f6; --sky:#dce8fb;
  --warn:#8a5a00; --warn-soft:#fbf1dc; --req:#7a2e0e; --req-soft:#fdeee6;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#121417; --page:#1c1f24; --text:#e6e4df; --muted:#a2a9b2; --line:#30353c;
    --link:#7fb0ff; --title:#9fb8ff;
    --green:#26341c; --aqua:#173634; --cream:#352d1c; --lavender:#2a2740; --sky:#1d2a40;
    --warn:#e6b65c; --warn-soft:#332a18; --req:#f2b391; --req-soft:#3a2219;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#121417; --page:#1c1f24; --text:#e6e4df; --muted:#a2a9b2; --line:#30353c;
  --link:#7fb0ff; --title:#9fb8ff;
  --green:#26341c; --aqua:#173634; --cream:#352d1c; --lavender:#2a2740; --sky:#1d2a40;
  --warn:#e6b65c; --warn-soft:#332a18; --req:#f2b391; --req-soft:#3a2219;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);
  font:16px/1.55 Arial,"Helvetica Neue",Helvetica,system-ui,sans-serif}
a{color:var(--link);font-weight:700;text-decoration:none}
a:hover,a:focus{text-decoration:underline}
p{margin:6px 0}
h1,h2,h3{margin:0}

.page{max-width:920px;margin:16px auto 40px;background:var(--page);padding:16px;
  display:flex;flex-direction:column;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.blk{background:var(--page);margin-bottom:14px;padding:0 0 12px;border-bottom:1px solid var(--line)}
.blk:last-child{border-bottom:none}

/* Header: artwork banner (no Tergar logo or branding for now) */
.hdr{background-size:cover;background-position:center;color:#fff;padding:34px 24px 30px;
  border-radius:4px;border-bottom:none}
.hdr h1{font-size:34px;font-weight:700;letter-spacing:.2px;text-shadow:0 1px 3px rgba(0,0,0,.5)}
.hdr-sub{margin-top:4px;font-size:17px;opacity:.95;text-shadow:0 1px 2px rgba(0,0,0,.5)}

.intro{background:var(--cream);padding:12px 16px;border-radius:4px;border-bottom:none;font-size:15px}
.quote{text-align:center;padding:10px 16px 14px}
.quote blockquote{margin:0;font-size:19px}
.quote .by{margin-top:6px;font-weight:700}

/* Section bands, as in the newsletters */
.band{font-size:21px;font-weight:400;padding:8px 14px;margin:0 -16px 10px;color:var(--text)}
.band-green{background:var(--green)}
.band-aqua{background:var(--aqua)}
.band-cream{background:var(--cream)}
.band-lavender{background:var(--lavender)}
.col .band{margin:0 0 10px}

h3{font-size:17px;font-weight:700;margin-top:4px}
.title-blue{color:var(--title);font-size:20px;font-weight:700}
.sub-h{color:var(--title);font-weight:700;margin-top:8px}
.with{font-weight:700;margin-bottom:2px}
.meta{color:var(--muted);font-size:14.5px}
.small{font-size:13px;color:var(--muted)}
.item{padding:8px 0;border-bottom:1px solid var(--line)}
.item:last-of-type{border-bottom:none}

.cols{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start;order:2}
.col{display:flex;flex-direction:column;min-width:0}
.col>.blk{padding-left:0;padding-right:0}

.kicker{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);
  background:var(--sky);display:inline-block;padding:2px 8px;border-radius:3px;margin-top:4px}
.feat .summary{margin:8px 0}
.requires{background:var(--req-soft);color:var(--req);border-left:3px solid var(--req);
  padding:6px 10px;margin:6px 0;font-size:14px;border-radius:0 4px 4px 0}
.requires.unknown{background:var(--warn-soft);color:var(--warn);border-left-color:var(--warn)}
.requires.small{font-size:13px;padding:3px 8px;margin:3px 0 0}
.localnote{background:var(--cream);padding:8px 10px;margin:8px 0;border-radius:4px;font-size:14.5px}
.contemplation{border:2px solid var(--muted);padding:8px 12px;margin-top:10px}
.cta{display:inline-block;margin-top:6px}
.attrib{font-size:13px;color:var(--muted);margin-top:4px}

.pa-list,.res-list{margin:0;padding-left:20px}
.pa-list li,.res-list li{margin-bottom:8px}
.pa-date{font-weight:700}
.pa-sub{font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.05em;
  color:var(--muted);margin:12px 0 6px;border-bottom:1px dashed var(--line);padding-bottom:3px}
.pa-sub:first-of-type{margin-top:4px}
.tag{display:inline-block;font-size:12px;padding:1px 7px;border-radius:999px;
  background:var(--sky);color:var(--title);margin-left:4px}

.foot{text-align:center;font-size:13.5px;color:var(--muted);border-top:1px solid var(--line);
  padding-top:12px;border-bottom:none}

/* Column balance filler: Indra's net artwork, 35% opacity, sized to cover */
.filler{order:99;flex:0 0 auto;height:0;opacity:.35;background-size:cover;background-position:center;
  border-radius:4px;margin-bottom:14px}

/* Preview only */
.preview-bar{background:var(--warn-soft);color:var(--warn);padding:10px 16px;font-size:14px;
  border-bottom:2px solid var(--warn)}
.preview-bar details{margin-top:4px}
.preview-bar ul{margin:6px 0 0;padding-left:20px}
.badge{display:block;font-size:12.5px;margin-top:4px;padding:3px 8px;border-radius:4px}
.badge.warn{background:var(--warn-soft);color:var(--warn);border:1px dashed var(--warn)}

/* Phone: one column. Blocks follow the 'order' set on each block:
   header, quote, announcement, schedule, next meeting, program announcements,
   featured events in date order, From Tergar, resources, footer. */
@media (max-width:700px){
  .page{margin:0;padding:12px 16px}
  .cols{display:contents}
  .col{display:contents}
  .filler{display:none}
  .hdr{padding:24px 16px}
  .hdr h1{font-size:28px}
  .band{margin:0 0 10px}
}