/* ==================================================================
   MHCCA FACELIFT  -  matches mhcca.ca: brand blue (#1470af) on light,
   Poppins headings + Open Sans body, nature-photo accents, swoop
   section transitions, and organic (leaf) shapes. Loaded after
   styles.css (linked on the landing page and injected site-wide by
   app.js), so its rules win and restyle the whole site.
   ================================================================== */

/* ---- palette: remap the teal ramp to MHCCA blue, keep green accents ---- */
:root{
  --teal-900:#0c3a5c; --teal-800:#0f527f; --teal-700:#1470af; --teal-600:#2384c4;
  --teal-500:#3f9bd6; --teal-300:#9ccdec; --teal-100:#dbedf9; --teal-50:#eef6fc;
  --blue-700:#0f527f; --blue-600:#1470af; --blue-500:#2384c4;
  --moss-700:#2f6b46; --moss-600:#3c7d52; --moss-500:#4f9a63; --moss-300:#a7cdab;
  --leaf-500:#5aa45e; --sky-700:#1470af; --sky-500:#3f9bd6;
  --paper:#ffffff; --cream:#eef6fc; --green-tint:#eef7ef; --bark:#1470af;
  --ink-900:#10222e; --ink-700:#33454f; --ink-500:#5d6b75; --ink-400:#8a98a4;
  --sand-50:#f6fafd; --sand-100:#eef4f8; --line:#e1e8ee; --line-soft:#eef2f6;
  --gold:#d6a43b;
  --shadow-sm:0 1px 2px rgba(16,52,82,.05),0 2px 8px rgba(16,52,82,.06);
  --shadow:0 10px 30px rgba(16,52,82,.10); --shadow-lg:0 26px 60px rgba(16,52,82,.16);
  --font-head:"Poppins","Inter",-apple-system,Segoe UI,Roboto,sans-serif;
  --font-sans:"Open Sans","Inter",-apple-system,Segoe UI,Roboto,sans-serif;
  --font-serif:"Poppins","Inter",sans-serif;
  --leaf-a:26px 26px 26px 6px; --leaf-b:26px 26px 6px 26px; --leaf-c:30px 6px 30px 30px;
  --blob:46% 54% 56% 44% / 52% 46% 54% 48%;
}
body{background:var(--paper);font-family:var(--font-sans);color:var(--ink-700);}
h1,h2,h3,h4,h5,.sec-head h2,.feature-body h2{font-family:var(--font-head);letter-spacing:-.01em;color:var(--ink-900);}

/* ---- kill the hexagon backdrops everywhere ---- */
.hexfield-layer{display:none !important;}
.hexfield-host{isolation:auto !important;}

/* ---- typographic rhythm ---- */
.kicker{font-family:var(--font-head);text-transform:uppercase;letter-spacing:.13em;font-size:.72rem;font-weight:600;color:var(--blue-600);}
.sec-head{max-width:680px;margin:0 auto 38px;text-align:center;}
.sec-head h2{font-size:clamp(1.7rem,3.4vw,2.5rem);font-weight:600;margin:.3em 0 .35em;color:var(--ink-900);}
.sec-sub{color:var(--ink-500);font-size:1.05rem;}

/* ---- buttons: organic leaf shape, MHCCA blue ---- */
.btn{border-radius:var(--leaf-a);font-family:var(--font-head);font-weight:500;transition:transform .15s ease,box-shadow .15s ease,background .15s ease;}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--blue-600);border:none;color:#fff;box-shadow:0 8px 20px rgba(20,112,175,.28);}
.btn-primary:hover{background:var(--blue-700);box-shadow:0 12px 26px rgba(20,112,175,.36);}
.btn-lg{padding:14px 28px;font-size:1.02rem;}
.btn-glass{background:rgba(255,255,255,.16);border:1.5px solid rgba(255,255,255,.6);color:#fff;backdrop-filter:blur(6px);border-radius:var(--leaf-b);}
.btn-glass:hover{background:rgba(255,255,255,.28);}
.btn-light,.btn-outline-light{background:#fff;border:1.5px solid var(--line);color:var(--blue-700);border-radius:var(--leaf-b);box-shadow:var(--shadow-sm);}
.btn-light:hover,.btn-outline-light:hover{border-color:var(--blue-500);color:var(--blue-600);}
.btn-ghost{border-radius:var(--leaf-b);}
.btn-coral{background:var(--moss-600);border:none;color:#fff;border-radius:var(--leaf-a);box-shadow:0 8px 20px rgba(47,107,70,.26);}
.btn-coral:hover{background:var(--moss-700);}

/* ---- cards + header ---- */
.card{border-radius:var(--leaf-a);border:1px solid var(--line);box-shadow:var(--shadow-sm);background:#fff;transition:transform .18s ease,box-shadow .18s ease;}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.site-header{background:rgba(255,255,255,.92);backdrop-filter:saturate(1.1) blur(10px);border-bottom:1px solid var(--line-soft);}
.brand-sub{font-family:var(--font-head);font-weight:500;color:var(--ink-700);}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 16px;border-radius:var(--leaf-b);background:var(--teal-50);color:var(--blue-700);font-family:var(--font-head);font-weight:500;font-size:.82rem;}
.eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--moss-500);display:inline-block;}

/* ---- dropdown nav: soft organic card menu ---- */
.nav-dd{position:relative;}
.nav-dd-btn{font-family:var(--font-head);font-weight:500;font-size:.95rem;color:var(--ink-700);background:transparent;border:none;padding:8px 14px;border-radius:var(--leaf-b);cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:background .15s ease,color .15s ease;}
.nav-dd-btn:hover,.nav-dd-btn.active{background:var(--teal-50);color:var(--blue-700);}
.nav-dd-btn::after{content:"";width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-1px);opacity:.7;transition:transform .18s ease;}
.nav-dd.open .nav-dd-btn::after{transform:rotate(225deg);}
.nav-dd-menu{position:absolute;top:calc(100% + 10px);left:0;min-width:240px;background:#fff;border:1px solid var(--line);border-radius:22px 22px 22px 8px;box-shadow:var(--shadow-lg);padding:10px;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .18s ease,transform .18s ease,visibility .18s;z-index:60;}
.nav-dd.open .nav-dd-menu{opacity:1;visibility:visible;transform:translateY(0);}
.nav-dd-menu a{display:block;padding:9px 14px;border-radius:14px;color:var(--ink-700);font-size:.92rem;text-decoration:none;transition:background .14s ease,color .14s ease;}
.nav-dd-menu a:hover{background:var(--teal-50);color:var(--blue-700);}
.nav-dd-mega .nav-dd-menu.nav-mega{min-width:420px;display:grid;grid-template-columns:1fr 1fr;gap:4px;}
.account-dd .nav-dd-menu{right:0;left:auto;border-radius:22px 22px 8px 22px;}
.nav-dd:hover>.nav-dd-menu,.nav-dd:focus-within>.nav-dd-menu{opacity:1;visibility:visible;transform:translateY(0);}

/* ---- swoop section dividers ---- */
.swoop{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:clamp(38px,5vw,74px);display:block;z-index:4;pointer-events:none;}
.swoop-top{bottom:auto;top:-1px;transform:rotate(180deg);}
.has-swoop{position:relative;}

/* ===================== PHOTO HERO (light, photo-right, fixed) ===================== */
.nhero{position:relative;background:linear-gradient(118deg,#0d4a78 0%,#176f8c 47%,#2f7d4f 100%);display:block;min-height:0;}
.nhero-photo{position:absolute;inset:0;background-size:cover;background-position:center;}
.nhero-veil{position:absolute;inset:0;background:linear-gradient(118deg,rgba(13,74,120,.90) 0%,rgba(23,111,140,.78) 47%,rgba(47,125,79,.80) 100%);}
.nhero-inner{position:relative;z-index:2;max-width:1180px;margin:0 auto;padding-top:84px;padding-bottom:120px;}
.nhero-inner>*{max-width:600px;}
.eyebrow-light{background:#fff;color:var(--blue-700);border:1px solid var(--teal-100);box-shadow:var(--shadow-sm);}
.nhero h1{font-family:var(--font-head);color:#fff;font-weight:600;font-size:clamp(2.1rem,4.8vw,3.7rem);line-height:1.06;margin:20px 0 18px;max-width:15ch;text-shadow:0 2px 20px rgba(8,40,66,.30);}
.nhero .lead{color:rgba(255,255,255,.92);font-size:clamp(1.04rem,1.6vw,1.24rem);max-width:52ch;margin:0 0 8px;}
.nhero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px;}
.nhero-scroll{display:none;}
.wave-bottom{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:74px;display:block;z-index:4;}
.wave-bottom path{fill:#fff;}

/* ===================== HOST STRIP ===================== */
.host-strip{background:#fff;padding:34px 0 38px;}
.host-strip-in{display:flex;align-items:center;gap:30px;flex-wrap:wrap;justify-content:center;text-align:left;}
.host-logo img{height:62px;width:auto;display:block;}
.host-strip p{margin:0;max-width:60ch;color:var(--ink-700);font-size:1rem;}

/* ===================== TEN PRINCIPLES (organic leaf cards) ===================== */
.principles-sec{background:var(--cream);}
.principles{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;}
.principle{background:#fff;border:1px solid var(--line);border-radius:var(--leaf-a);padding:24px 18px;box-shadow:var(--shadow-sm);position:relative;transition:transform .18s ease,box-shadow .18s ease;}
.principle:nth-child(even){border-radius:var(--leaf-b);}
.principle:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.principle .p-num{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--blob);background:var(--teal-50);color:var(--blue-700);font-family:var(--font-head);font-size:1.05rem;font-weight:600;margin-bottom:12px;}
.principle:nth-child(3n) .p-num{background:var(--green-tint);color:var(--moss-700);}
.principle h4{font-size:.95rem;line-height:1.34;margin:0;color:var(--ink-900);font-family:var(--font-head);font-weight:500;}
a.principle{text-decoration:none;color:inherit;cursor:pointer;}
a.principle:hover h4{color:var(--blue-700);}
a.principle:hover .p-num{background:var(--pop-tint);color:var(--pop-dark);}

/* ===================== PHOTO QUOTE BANDS (MHCCA blue, not navy) ===================== */
.band{position:relative;overflow:hidden;background:var(--blue-600);}
.band-photo{position:absolute;inset:0;background-size:cover;background-position:center;}
.band-veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,112,175,.80),rgba(15,82,127,.86));}
.band-inner{position:relative;z-index:2;text-align:center;padding:84px 0;}
.band-quote{font-family:var(--font-head);font-weight:600;font-size:clamp(1.7rem,4vw,2.9rem);line-height:1.2;color:#fff;max-width:22ch;margin:0 auto;}
.band-attr{color:rgba(255,255,255,.85);margin-top:16px;font-size:1rem;}
.band-cta{background:var(--blue-700);}
.band-cta .band-inner{padding:92px 0;}
.band-cta h2{color:#fff;font-size:clamp(1.8rem,3.6vw,2.7rem);margin:.3em auto .3em;max-width:18ch;}
.band-cta .kicker{color:#bfe0f4;}
.band-lead{color:rgba(255,255,255,.92);max-width:54ch;margin:0 auto;font-size:1.08rem;}

/* ===================== FEATURE ROWS ===================== */
.feature-sec{background:#fff;}
.cedar-sec{background:var(--green-tint);}
.feature{display:grid;grid-template-columns:1.05fr 1fr;gap:54px;align-items:center;}
.feature-rev .feature-media{order:2;}
.feature-media{position:relative;}
.imgwrap{position:relative;border-radius:34px 34px 34px 10px;overflow:hidden;box-shadow:var(--shadow-lg);aspect-ratio:4/3;background:linear-gradient(135deg,var(--teal-100),var(--green-tint));}
.imgwrap::after{content:"";position:absolute;inset:0;background:linear-gradient(118deg,rgba(13,74,120,.62) 0%,rgba(23,111,140,.40) 50%,rgba(47,125,79,.62) 100%);pointer-events:none;}
.feature-rev .imgwrap{border-radius:34px 34px 10px 34px;}
.imgwrap img{width:100%;height:100%;object-fit:cover;display:block;}
.badge-float{position:absolute;left:-14px;top:18px;background:#fff;border-radius:var(--leaf-b);padding:9px 15px;font-family:var(--font-head);font-weight:600;font-size:.82rem;box-shadow:var(--shadow);}
.badge-float.badge-program{color:var(--blue-700);}
.badge-float.badge-participant{color:var(--moss-700);left:auto;right:-14px;border-radius:var(--leaf-a);}
.feature-body h2{font-size:clamp(1.6rem,3vw,2.3rem);font-weight:600;color:var(--ink-900);margin:.25em 0 .4em;}
.feature-body p{color:var(--ink-700);font-size:1.04rem;}

/* ===================== INITIATIVE IMAGE CARDS (organic) ===================== */
.types-sec{background:#fff;}
.imgcards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.imgcard{border-radius:28px 28px 28px 8px;overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-sm);transition:transform .2s ease,box-shadow .2s ease;}
.imgcard:nth-child(2){border-radius:28px 28px 8px 28px;}
.imgcard:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);}
.imgcard-photo{height:210px;background-size:cover;background-position:center;}
.imgcard-body{padding:20px 22px 24px;}
.imgcard-body h4{margin:0 0 7px;font-family:var(--font-head);font-weight:600;font-size:1.2rem;color:var(--ink-900);}
.imgcard-body p{margin:0;color:var(--ink-500);font-size:.96rem;line-height:1.5;}

/* ===================== JOURNEY (organic blob steps) ===================== */
.njourney-sec{background:var(--cream);}
.njourney{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.nj-step{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--leaf-a);padding:26px 22px;text-decoration:none;color:inherit;box-shadow:var(--shadow-sm);transition:transform .18s ease,box-shadow .18s ease;}
.nj-step:nth-child(even){border-radius:var(--leaf-b);}
.nj-step:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.nj-num{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:var(--blob);background:var(--blue-600);color:#fff;font-family:var(--font-head);font-weight:600;font-size:1.2rem;margin-bottom:14px;}
.nj-step:nth-child(3n) .nj-num{background:var(--moss-600);}
.nj-step h4{margin:0 0 6px;font-family:var(--font-head);font-weight:600;font-size:1.06rem;color:var(--ink-900);}
.nj-step p{margin:0;color:var(--ink-500);font-size:.93rem;line-height:1.45;}

/* ===================== FOOTER (MHCCA blue, white logo, land ack) ===================== */
.site-footer{background:var(--blue-700);color:rgba(255,255,255,.85);}
.site-footer h5{font-family:var(--font-head);color:#fff;}
.site-footer a{color:rgba(255,255,255,.8);}
.site-footer a:hover{color:#fff;}
.brand-logo-white{filter:none;height:54px;}
.site-footer .footer-grid p{color:#bfe0f4 !important;}
.land-ack{border-top:1px solid rgba(255,255,255,.16);margin-top:30px;padding-top:22px;}
.land-ack p{margin:0;max-width:none;font-size:.86rem;line-height:1.7;color:rgba(255,255,255,.78);font-style:italic;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.16);}

/* ===================== INTERIOR PAGE PHOTO HEADER ===================== */
.page-hero{position:relative;overflow:hidden;background:var(--cream);}
.page-hero-photo{position:absolute;top:0;right:0;bottom:0;left:46%;background-size:cover;background-position:center;}
.page-hero-veil{position:absolute;inset:0;background:linear-gradient(95deg,var(--cream) 0%,var(--cream) 38%,rgba(238,246,252,.4) 60%,rgba(238,246,252,0) 82%);}
.page-hero-inner{position:relative;z-index:2;padding:64px 0 88px;}
.page-hero h1{font-family:var(--font-head);font-weight:600;color:var(--ink-900);font-size:clamp(1.9rem,4vw,3rem);margin:14px 0 12px;max-width:18ch;}
.page-hero p{color:var(--ink-700);max-width:56ch;font-size:1.08rem;}

/* ===================== RESPONSIVE ===================== */
@media (max-width:900px){
  .principles{grid-template-columns:repeat(2,1fr);}
  .feature{grid-template-columns:1fr;gap:30px;}
  .feature-rev .feature-media{order:0;}
  .imgcards{grid-template-columns:1fr;}
  .njourney{grid-template-columns:1fr 1fr;}
  .nhero-photo{left:0;opacity:.5;}
  .nhero-veil{background:linear-gradient(160deg,rgba(13,74,120,.92),rgba(23,111,140,.82) 55%,rgba(47,125,79,.86));}
  .nhero-inner{padding-top:60px;padding-bottom:90px;}
  .nhero-inner>*{max-width:none;}
  .host-strip-in{flex-direction:column;text-align:center;}
  .nav-dd-mega .nav-dd-menu.nav-mega{min-width:0;grid-template-columns:1fr;}
}
@media (max-width:560px){
  .principles{grid-template-columns:1fr;}
  .njourney{grid-template-columns:1fr;}
}

/* ============================================================
   ROUND 3  -  faint forest backdrop, green pop, transparent
   sections, consistent swoops, nav + footer touches.
   ============================================================ */
:root{ --pop:#7eaf04; --pop-dark:#688f04; --pop-tint:#eef6da; --page-bg:#f1f7fc; }

/* faint forest line-art behind every page */
html{background:var(--page-bg);}
body{background:var(--page-bg);}

/* light sections become transparent so the forest shows faintly through */
.host-strip,.principles-sec,.feature-sec,.cedar-sec,.types-sec,.njourney-sec,
.page-hero,main>.section,section.section,.section-sm{background:transparent !important;}
/* content surfaces stay solid for legibility over the backdrop */
.card,.principle,.nj-step,.imgcard,.nav-dd-menu,.fb-modal,.tool-card,.table,table{background:#fff;}

/* green accent pop (#7eaf04) */
.fb-tab{background:var(--pop) !important;color:#fff !important;border-color:var(--pop) !important;}
.fb-tab:hover{background:var(--pop-dark) !important;}
.btn-pop{background:var(--pop);border:none;color:#fff;border-radius:var(--leaf-a);box-shadow:0 8px 20px rgba(126,175,4,.30);font-family:var(--font-head);font-weight:500;}
.btn-pop:hover{background:var(--pop-dark);color:#fff;transform:translateY(-2px);}
.principle:nth-child(3n) .p-num{background:var(--pop-tint);color:var(--pop-dark);}
.nj-step:nth-child(3n) .nj-num{background:var(--pop);}
.principle::before{background:linear-gradient(var(--pop),var(--blue-500)) !important;}
.badge-float.badge-participant{color:var(--pop-dark);}

/* nav mega: first row (Framework overview) spans both columns */
.nav-dd-mega .nav-dd-menu.nav-mega{grid-template-columns:1fr 1fr;gap:4px;}
.nav-mega .nav-mega-top{grid-column:1 / -1;background:var(--teal-50);border-radius:14px;font-family:var(--font-head);font-weight:600;color:var(--blue-700);margin-bottom:2px;}
.nav-mega .nav-mega-top.active{background:var(--blue-600);color:#fff;}

/* swoop fills now match the continuous light page base */
.wave-bottom path,.swoop path[data-page]{fill:var(--page-bg);}
.swoop-top{top:0;bottom:auto;transform:scaleY(-1);}

/* blue bands stay solid; photo kept as a faint texture */
.band-veil{background:linear-gradient(118deg,rgba(13,74,120,.86),rgba(23,111,140,.78) 47%,rgba(47,125,79,.84));}
.band-cta .band-veil{background:linear-gradient(118deg,rgba(13,74,120,.93),rgba(20,86,112,.92) 50%,rgba(40,104,72,.92));}

/* footer swoop: a blue wave rising into the content, on every page */
.site-footer{position:relative;margin-top:0 !important;}
/* breathing room before the footer on interior pages (home CTA band stays flush) */
body:not(.home-nature) main>section:last-child{padding-bottom:clamp(76px,8vw,108px);}
/* admin review count: red bubble centred at the right of the "Admin centre" menu row */
.account-menu .menu-badge{top:50%;right:12px;transform:translateY(-50%);}
/* expert map markers: circular profile photo instead of the default Leaflet pin */
.expert-marker{background:none;border:0;}
.em-pin{box-sizing:border-box;width:44px;height:44px;border-radius:50%;border:3px solid #fff;box-shadow:0 3px 9px rgba(15,40,50,.35);overflow:hidden;background:var(--teal-100);transition:transform .15s ease,box-shadow .15s ease;}
.em-pin img{width:100%;height:100%;object-fit:cover;display:block;}
.em-ini{width:100%;height:100%;display:grid;place-items:center;font-weight:700;color:var(--teal-700);font-family:var(--font-head);font-size:1rem;}
.em-tip{width:0;height:0;margin:-3px auto 0;border-left:7px solid transparent;border-right:7px solid transparent;border-top:9px solid #fff;filter:drop-shadow(0 2px 1px rgba(15,40,50,.3));}
.expert-marker:hover .em-pin{transform:scale(1.08);box-shadow:0 5px 14px rgba(15,40,50,.42);}
.site-footer::before{content:"";position:absolute;left:0;top:0;width:100%;height:clamp(34px,4vw,62px);transform:translateY(-99%);pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'%3E%3Cpath d='M0,30 C220,64 420,6 660,30 C900,54 1100,10 1440,38 L1440,64 L0,64 Z' fill='%230f527f'/%3E%3C/svg%3E") no-repeat;background-size:100% 100%;}

@media (max-width:700px){ body{background-attachment:scroll;background-size:cover;} }

/* ============================================================
   ROUND 4  -  framework/step dark heroes + bigger header logo
   ============================================================ */
/* header MHCCA logo 25% larger (68px -> 85px) */
.site-header .brand .brand-logo{height:85px;}
@media(max-width:560px){ .site-header .brand .brand-logo{height:64px;} }

/* dark step + framework hero: blue-to-green gradient, faint forest, swoop bottom */
.hero-dark{position:relative;background:linear-gradient(118deg,#0d4a78 0%,#176f8c 47%,#2f7d4f 100%) !important;}
.hero-dark::before{content:"";position:absolute;inset:0;background:url("forest-bg.svg") no-repeat bottom center;background-size:100% auto;opacity:.16;pointer-events:none;z-index:0;}
.hero-dark::after{content:"";position:absolute;left:0;bottom:-1px;width:100%;height:clamp(34px,4vw,58px);pointer-events:none;z-index:1;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 58' preserveAspectRatio='none'%3E%3Cpath d='M0,26 C220,58 420,4 660,28 C900,52 1100,8 1440,34 L1440,58 L0,58 Z' fill='%23f1f7fc'/%3E%3C/svg%3E") no-repeat;background-size:100% 100%;}
.hero-dark .wrap{position:relative;z-index:2;}
.hero-dark h1{color:#fff;}
.hero-dark .lead{color:rgba(255,255,255,.9);}
/* the "Step X of 7" pill: green with white text */
.hero-dark .eyebrow{background:var(--pop) !important;color:#fff !important;border:none !important;box-shadow:0 6px 16px rgba(126,175,4,.32);}
.hero-dark .eyebrow .dot{background:#fff !important;}