/* 14423160 Canada Foundation — shared chocolate theme */
:root{
  --cream:#f7efde; --card:#fbf5e8; --line:#e7d6ad;
  --ink:#4b3a26; --ink2:#5f4e38; --gold:#b88a2f; --gold2:#cfa44e;
  --choc1:#5a3a22; --choc2:#3a2414;
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  background:linear-gradient(180deg,#f7efde 0%,#efe3cb 60%,#e7dabf 100%);
  color:var(--ink2);
  font-family:"Segoe UI",system-ui,-apple-system,Helvetica,Arial,sans-serif;
  line-height:1.55;-webkit-font-smoothing:antialiased;min-height:100%;
}
h1,h2,h3,.brand,.serif{font-family:Georgia,"Times New Roman",serif}
a.link{color:#a9772a;text-decoration:underline;text-underline-offset:2px}
a.link:hover{color:#7e5c1f}

.wrap{max-width:740px;margin:0 auto;padding:30px 22px 64px}
.top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;margin-bottom:24px;gap:10px}
.home{color:var(--gold);text-decoration:none;font-size:14px;justify-self:start}
.home:hover{color:#8c6a22}
.brand{font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:#a9772a;text-align:center}

header.hero{text-align:center;margin:6px 0 26px}
.seal{font-size:30px;color:var(--gold2);line-height:1}
h1{font-size:34px;color:var(--ink);margin:.22em 0 .12em}
.sub{font-size:16px;color:var(--ink2);font-style:italic;margin:0}

/* step rows with chocolate-coin numbers (pure CSS) */
.step{display:flex;gap:18px;margin:28px 0}
.coin{flex:0 0 auto;width:48px;height:48px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:Georgia,serif;font-weight:700;font-size:22px;color:#f3e7cd;
  background:radial-gradient(circle at 38% 32%, #7a5230 0%, #4d301a 60%, #3a2414 100%);
  box-shadow:0 0 0 2px var(--gold2), inset 0 2px 3px rgba(255,220,170,.35),
    inset 0 -3px 5px rgba(0,0,0,.4), 0 2px 4px rgba(60,30,10,.35);
  text-shadow:0 1px 1px rgba(0,0,0,.45)}
.content{flex:1;min-width:0}
.content h2{font-size:21px;color:var(--ink);margin:.1em 0 .35em}
.content p{margin:.35em 0}

.box{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:13px 16px;margin:11px 0}
.box.quote{font-style:italic;color:#5a4a30;border-left:3px solid var(--gold2)}
.recipient{font-weight:700;color:var(--ink);letter-spacing:.01em}
.etlabel{font-size:13px;color:#8c6a22}
.underline{font-size:14px;color:var(--ink2);margin-top:8px}
.label{font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:#a9772a;margin:8px 0 8px}
.pill{display:inline-block;background:#f0dcb0;color:#7c5a1d;border:1px solid #e0c98f;
  border-radius:999px;padding:3px 11px;font-size:12.5px;font-weight:600;margin:.2em 0}
.skip{font-size:13.5px;color:#8c7a5f;font-style:italic;margin-top:8px}
.note{background:#f4ead2;border:1px solid #e6d3a6;border-radius:12px;padding:14px 16px;margin:0 0 22px;font-size:14.5px;color:#6a5942}
.note b{color:var(--ink)}
.note.important{background:#fbe9d8;border:2px solid #c2603a;border-left:6px solid #c2603a;color:#5a3320}
.note.important .ititle{display:block;font-family:Georgia,serif;font-weight:700;font-size:16px;color:#9a3b2a;margin:0 0 6px}
.note.important b{color:#7a2c1c}

/* chocolate-square bullets (pure CSS) */
ul.choc{list-style:none;margin:0;padding:0;display:grid;gap:9px}
ul.choc li{position:relative;padding-left:30px;font-size:14.5px;color:var(--ink2);line-height:1.5}
ul.choc li::before{content:"";position:absolute;left:0;top:3px;width:16px;height:16px;border-radius:4px;
  background:linear-gradient(145deg,#7a5230,#4d301a 70%);
  box-shadow:inset 0 1px 1px rgba(255,220,170,.4),inset 0 -2px 3px rgba(0,0,0,.45),0 1px 2px rgba(60,30,10,.3)}
ul.choc li b{color:var(--ink)}
ol.choc{margin:0;padding-left:22px;display:grid;gap:9px}
ol.choc li{font-size:14.5px;color:var(--ink2);line-height:1.5}
ol.choc li b{color:var(--ink)}

/* chocolate CTA pill */
.cta{display:inline-block;margin-top:6px;background:linear-gradient(180deg,var(--choc1),var(--choc2));
  color:#f1e7d0;text-decoration:none;font-weight:600;font-size:15px;padding:11px 20px;border-radius:999px;
  box-shadow:inset 0 1px 0 rgba(255,210,170,.3),0 3px 7px rgba(60,30,10,.3),0 0 0 2px var(--gold2);cursor:pointer;border:0}
.cta:hover{filter:brightness(1.06)}
.cta.full{display:block;text-align:center;width:100%}

/* brass nameplate tag — matches the tags on the chocolate box */
.tag{display:inline-block;font-family:Georgia,serif;font-weight:700;letter-spacing:.02em;
  color:#5a4423;text-decoration:none;font-size:18px;padding:12px 30px;border-radius:7px;position:relative;
  background:linear-gradient(180deg,#f4e2ac 0%,#e7c878 45%,#d4ad58 55%,#eedaa0 100%);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.7),inset 0 -2px 3px rgba(120,85,25,.45),
    0 3px 6px rgba(70,45,15,.4), 0 0 0 2px #b9913f;
  text-shadow:0 1px 0 rgba(255,250,235,.6)}
.tag:hover{filter:brightness(1.05)}

/* role cards (join page) */
.cards{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:18px 0}
.rolecard{display:block;text-decoration:none;background:var(--card);border:1px solid var(--line);
  border-radius:16px;padding:26px 22px;text-align:center;color:var(--ink2);
  box-shadow:0 3px 9px rgba(80,50,20,.08);transition:transform .15s ease,box-shadow .15s ease}
.rolecard:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(80,50,20,.16)}
.rolecard .ico{font-size:40px;line-height:1}
.rolecard h2{font-size:22px;color:var(--ink);margin:.4em 0 .2em}
.rolecard p{font-size:14px;margin:0}
@media (max-width:520px){.cards{grid-template-columns:1fr}}

/* interest form */
.enquire{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px 18px}
.enquire label{display:block;font-size:13px;color:#8c6a22;margin:8px 0 4px}
.enquire input,.enquire textarea{width:100%;border:1px solid var(--line);border-radius:9px;
  padding:11px 12px;font:inherit;color:var(--ink);background:#fffdf7}
.enquire input:focus,.enquire textarea:focus{outline:2px solid var(--gold2);outline-offset:1px}
.fallback{font-size:13.5px;color:#6a5942;margin-top:10px}

/* password gate */
.gate{background:#f4ead2;border:1px solid #e6d3a6;border-radius:14px;padding:18px;text-align:center}
.gate .lockico{font-size:26px;color:var(--gold)}
.gate input{width:200px;max-width:70%;text-align:center;letter-spacing:.15em;
  border:1px solid var(--line);border-radius:9px;padding:11px 12px;font:inherit;color:var(--ink);background:#fffdf7;margin:8px 6px 0}
.gate .err{color:#9a3b2a;font-size:13.5px;min-height:18px;margin-top:8px}

/* unlocked, grouped document list */
.docintro{font-size:14px;color:#6a5942;background:#f4ead2;border:1px solid #e6d3a6;
  border-radius:10px;padding:10px 14px;margin:0 0 16px}
.docsection{font-family:Georgia,serif;font-size:24px;font-weight:700;color:var(--choc1);margin:28px 0 6px;
  padding-bottom:5px;border-bottom:2px solid var(--gold2)}
.docgroup{margin:16px 0}
.doclabel{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:#a9772a;
  font-weight:700;margin:0 0 8px}
.doclist{display:grid;gap:8px}
.docline{display:flex;align-items:stretch;gap:10px}
.dnum{flex:0 0 auto;width:26px;height:26px;border-radius:50%;margin-top:9px;
  display:flex;align-items:center;justify-content:center;font-family:Georgia,serif;
  font-weight:700;font-size:14px;color:#f3e7cd;
  background:radial-gradient(circle at 38% 32%,#7a5230,#3a2414 70%);
  box-shadow:0 0 0 1.5px var(--gold2),inset 0 -2px 3px rgba(0,0,0,.4)}
.docrow{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;text-decoration:none;
  background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 13px}
.docrow:hover{border-color:var(--gold2);background:#fff8ea}
.docrow .dname{font-size:14.5px;color:var(--ink);font-weight:600;position:relative;padding-left:22px}
.docrow .dname::before{content:"";position:absolute;left:0;top:3px;width:13px;height:13px;border-radius:3px;
  background:linear-gradient(145deg,#7a5230,#4d301a 70%);
  box-shadow:inset 0 1px 1px rgba(255,220,170,.4),inset 0 -2px 3px rgba(0,0,0,.45)}
.docrow .ddesc{font-size:13px;color:#7a6a52;padding-left:22px}
.hidden{display:none}

/* government reference (thumbnail + external link, not hosted) */
.govt{display:flex;gap:16px;align-items:flex-start;background:var(--card);border:1px solid var(--line);
  border-radius:12px;padding:14px;margin:12px 0}
.govt img{width:96px;height:auto;border:1px solid var(--line);border-radius:6px;flex:0 0 auto;box-shadow:0 2px 5px rgba(60,30,10,.18)}
.govt .gmeta h3{font-size:16px;color:var(--ink);margin:0 0 4px}
.govt .gmeta p{font-size:13.5px;margin:0 0 8px}

footer{text-align:center;margin-top:42px;color:#8c7a5f;font-size:13px;line-height:1.8}
footer .brand{display:block;margin-top:6px}
footer .appt{color:#9a7a3f}

@media (max-width:560px){h1{font-size:28px} .coin{width:42px;height:42px;font-size:20px} .step{gap:14px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ===== landing page (moved out of index.html inline <style>) ===== */
.lander{max-width:1000px;margin:0 auto;padding:10px 20px;min-height:100vh;min-height:100svh;
  display:flex;flex-direction:column;justify-content:center;text-align:center}
.eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#a9772a;margin:0 0 3px}
.lander h1{font-size:24px;color:var(--ink);margin:0 0 3px}
.lander .tagline{font-style:italic;color:var(--ink2);margin:0 0 12px}
.stage{position:relative;display:inline-block;align-self:center;max-width:1000px;line-height:0}
.stage img{width:auto;max-width:100%;max-height:58vh;max-height:58svh;height:auto;border-radius:14px;display:block;box-shadow:0 10px 26px rgba(70,45,15,.22)}
.lander footer{margin-top:10px;font-size:12px;line-height:1.6}
.hotspot{position:absolute;display:flex;align-items:flex-end;justify-content:center;padding-bottom:5px;border-radius:8px;-webkit-tap-highlight-color:transparent}
.hotspot:focus-visible{outline:2px solid #cfa44e;outline-offset:2px}
.tap-hint{font-size:9.5px;font-weight:700;font-family:Georgia,serif;background:rgba(90,58,34,.85);color:#f3e7cd;padding:2px 8px;border-radius:999px;white-space:nowrap;pointer-events:none;letter-spacing:.03em;box-shadow:0 1px 3px rgba(0,0,0,.3)}

/* compact brass section links under the landing image — keeps everything on one screen */
.landnav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 10px;margin:10px 0 0}
.landnav a{font-family:Georgia,serif;font-size:13.5px;font-weight:700;color:#5a4423;text-decoration:none;
  padding:6px 14px;border-radius:7px;
  background:linear-gradient(180deg,#f4e2ac 0%,#e7c878 45%,#d4ad58 55%,#eedaa0 100%);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.7),inset 0 -2px 3px rgba(120,85,25,.45),0 2px 4px rgba(70,45,15,.3),0 0 0 1.5px #b9913f}
.landnav a:hover{filter:brightness(1.05)}
.landnav a:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}

/* ===== join page choice buttons (moved out of join.html inline <style>) ===== */
.choicebtns{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:2px 0 4px}
@media(max-width:520px){.choicebtns{grid-template-columns:1fr}}
.choicebtns input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.choicebtn{display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;text-align:center;
  font-family:Georgia,serif;font-weight:700;font-size:15.5px;color:#5a4423;padding:15px 16px;border-radius:12px;
  background:linear-gradient(180deg,#f4e2ac 0%,#e7c878 45%,#d4ad58 55%,#eedaa0 100%);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.7),inset 0 -2px 3px rgba(120,85,25,.45),0 3px 6px rgba(70,45,15,.3),0 0 0 2px #b9913f;
  transition:transform .12s ease, filter .12s ease, box-shadow .12s ease}
.choicebtn::before{content:"";width:16px;height:16px;border-radius:4px;flex:0 0 auto;
  background:linear-gradient(145deg,#7a5230,#4d301a 70%);
  box-shadow:inset 0 1px 1px rgba(255,220,170,.4),inset 0 -2px 3px rgba(0,0,0,.45)}
.choicebtn:hover{filter:brightness(1.04);transform:translateY(-1px)}
.choicebtns input:checked + .choicebtn{color:#f1e7d0;
  background:linear-gradient(180deg,#5a3a22,#3a2414);
  box-shadow:inset 0 1px 0 rgba(255,210,170,.3),0 3px 8px rgba(60,30,10,.4),0 0 0 2px var(--gold2),0 0 16px 3px rgba(207,164,78,.6)}
.choicebtns input:checked + .choicebtn::before{background:linear-gradient(145deg,#f4e2ac,#cfa44e 70%)}
.choicebtns input:focus-visible + .choicebtn{outline:3px solid var(--gold2);outline-offset:2px}
.enquire textarea{min-height:84px;resize:vertical}

/* ===== brand emblem (replaces the heart seal in page headers) ===== */
.emblem{width:74px;height:74px;border-radius:18px;object-fit:cover;display:inline-block;
  box-shadow:0 3px 8px rgba(70,45,15,.22),0 0 0 1px var(--line)}

/* ===== print ===== */
@media print{
  .top,.gate,.landnav,.fallback,.skip,.home{display:none!important}
  body{background:#fff}
  .wrap{padding-top:8px}
}

/* ===== landing announcement strip (evergreen status + next upcoming event) ===== */
.announce{align-self:center;display:inline-flex;align-items:center;gap:9px;max-width:100%;
  background:#f4ead2;border:1px solid #e6d3a6;border-radius:999px;
  padding:7px 17px;margin:0 0 12px;font-size:13.5px;line-height:1.3;color:#6a5942;
  text-decoration:none;box-shadow:0 1px 3px rgba(70,45,15,.10);transition:background .15s ease}
.announce::before{content:"";width:9px;height:9px;border-radius:50%;flex:0 0 auto;
  background:radial-gradient(circle at 40% 35%,#e7c878,#b88a2f);box-shadow:0 0 0 3px rgba(184,138,47,.18)}
.announce b{color:var(--ink)}
.announce:hover{background:#f0dcb0;color:var(--ink)}
.announce[hidden]{display:none}