:root{--ink:#142522;--forest:#123f37;--green:#16745d;--mint:#dff4ea;--lime:#d9f263;--cream:#fbfaf4;--white:#fff;--muted:#5c6b67;--line:#d9e4df;--orange:#ef8a46;--max:1180px;--radius:22px;--shadow:0 20px 55px rgba(18,63,55,.12)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.65 Inter,Arial,sans-serif}img{max-width:100%}a{color:inherit}.skip{position:absolute;left:-9999px;background:#fff;padding:.75rem;z-index:99}.skip:focus{left:1rem}.wrap{width:min(calc(100% - 40px),var(--max));margin:auto}.site-header{position:sticky;top:0;z-index:20;background:rgba(251,250,244,.97);border-bottom:1px solid var(--line)}.header-inner{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:850;font-size:1.25rem;letter-spacing:-.03em}.brand-mark{width:38px;height:38px;border-radius:13px;background:var(--forest);display:grid;place-items:center;color:var(--lime);font-size:1.25rem}.nav{display:flex;gap:24px;align-items:center}.nav a{text-decoration:none;font-size:.93rem;font-weight:700}.nav a:hover,.nav a:focus-visible,.nav [aria-current=page]:not(.button){color:var(--green)}.menu{display:none;border:1px solid var(--line);background:white;border-radius:10px;padding:.55rem}.button{display:inline-flex;justify-content:center;align-items:center;border:2px solid var(--forest);border-radius:99px;background:var(--forest);color:white;padding:.75rem 1.15rem;font-weight:800;text-decoration:none;cursor:pointer}.button:hover,.button:focus-visible{background:var(--green);border-color:var(--green)}.button.light{background:var(--lime);border-color:var(--lime);color:var(--ink)}.button.outline{background:transparent;color:var(--forest)}.hero{padding:clamp(72px,10vw,128px) 0;background:radial-gradient(circle at 84% 30%,#d9f26366 0 12%,transparent 36%),linear-gradient(135deg,var(--cream),#edf8f1)}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}.eyebrow{font-size:.76rem;font-weight:850;letter-spacing:.16em;text-transform:uppercase;color:var(--green)}h1,h2,h3{line-height:1.06;letter-spacing:-.04em;margin:0 0 .55em}h1{font-size:clamp(3.2rem,7vw,6.6rem)}h2{font-size:clamp(2rem,4vw,3.7rem)}h3{font-size:1.35rem}.lead{font-size:clamp(1.08rem,2vw,1.3rem);color:var(--muted);max-width:760px}.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.lab-card{background:var(--forest);color:white;border-radius:32px;padding:38px;box-shadow:var(--shadow);transform:rotate(1.5deg)}.lab-card h2{font-size:2rem}.lab-card p{color:#d5e5df}.meter{display:flex;gap:8px;margin:30px 0}.meter span{height:9px;flex:1;border-radius:99px;background:#ffffff24}.meter span.on{background:var(--lime)}.lab-row{display:flex;justify-content:space-between;border-top:1px solid #ffffff2b;padding:16px 0}.section{padding:clamp(72px,9vw,112px) 0}.white{background:white}.mint{background:var(--mint)}.dark{background:var(--forest);color:white}.dark p{color:#d5e5df}.intro{display:grid;grid-template-columns:.55fr 1.45fr;gap:60px;margin-bottom:48px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}.card{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:30px}.card p{color:var(--muted)}.card .number{display:block;color:var(--green);font-size:.82rem;font-weight:850;margin-bottom:38px}.dark .card{background:#1b554a;border-color:#37776a}.dark .card p{color:#d6e5df}.path{counter-reset:path}.path-step{counter-increment:path;display:grid;grid-template-columns:64px 1fr;gap:20px;border-top:1px solid var(--line);padding:28px 0}.path-step:before{content:"0" counter(path);font-weight:850;color:var(--green)}.page-hero{padding:86px 0 72px;background:linear-gradient(135deg,#edf8f1,var(--cream))}.page-hero h1{font-size:clamp(3rem,6vw,5.6rem)}.breadcrumb{font-size:.9rem;color:var(--muted);margin-bottom:32px}.breadcrumb a{color:var(--green)}.prose{max-width:850px}.prose h2{font-size:2rem;margin-top:2em}.prose h3{margin-top:1.7em}.callout{border-left:5px solid var(--lime);background:var(--forest);color:white;padding:24px 28px;border-radius:0 16px 16px 0}.source{font-size:.88rem;color:var(--muted)}.source a{color:var(--green)}.tool-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:30px}.tool-panel,.result-panel{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:30px}.field{margin-bottom:18px}.field label{display:block;font-weight:800;margin-bottom:6px}.field input,.field select,.field textarea{width:100%;padding:.82rem;border:1px solid #879b94;border-radius:10px;background:white;font:inherit}.result-number{font-size:clamp(2.3rem,5vw,4rem);font-weight:900;color:var(--forest);line-height:1}.bar-chart{display:flex;align-items:end;gap:12px;height:190px;margin:28px 0}.bar{flex:1;min-height:4px;border-radius:8px 8px 0 0;background:var(--green);position:relative}.bar.cost{background:var(--orange)}.legend{display:flex;gap:20px;font-size:.9rem}.dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--green);margin-right:6px}.dot.cost{background:var(--orange)}.quiz-option{display:block;border:1px solid var(--line);border-radius:14px;padding:14px;margin:10px 0;cursor:pointer}.quiz-option:has(input:checked){border-color:var(--green);background:var(--mint)}.contact-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:50px}.form{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:34px;box-shadow:var(--shadow)}.honeypot{position:absolute;left:-9999px}.muted{color:var(--muted);font-size:.92rem}.cta{background:var(--lime);padding:65px 0}.cta-grid{display:flex;justify-content:space-between;align-items:center;gap:30px}.cta h2{margin:0;max-width:780px}.site-footer{background:#0b302a;color:#d7e5e0;padding:62px 0 24px}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:45px}.site-footer h2{font-size:1rem;color:white}.site-footer ul{list-style:none;padding:0}.site-footer a{text-decoration:none}.copyright{border-top:1px solid #356259;margin-top:36px;padding-top:20px;display:flex;justify-content:space-between}.disclaimer{background:#f1f3ee;border-top:1px solid var(--line);padding:18px 0;font-size:.85rem;color:var(--muted)}:focus-visible{outline:3px solid var(--orange);outline-offset:3px}@media(max-width:980px){.menu{display:block}.nav{display:none;position:absolute;top:82px;left:0;right:0;background:var(--cream);border-bottom:1px solid var(--line);padding:24px;flex-direction:column;align-items:flex-start}.nav[data-open=true]{display:flex}.hero-grid,.intro,.tool-grid,.contact-grid,.footer-grid{grid-template-columns:1fr}.grid-3{grid-template-columns:1fr 1fr}.lab-card{transform:none}.intro{gap:16px}}@media(max-width:650px){.wrap{width:min(calc(100% - 28px),var(--max))}.grid-3,.grid-2{grid-template-columns:1fr}.hero h1,.page-hero h1{font-size:3.05rem}.lab-card{padding:25px}.cta-grid{align-items:flex-start;flex-direction:column}.copyright{display:block}.form{padding:22px}}
/* Homepage goal finder */
.goal-finder-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 34px; align-items: start; }
.goal-finder-form fieldset { border: 0; padding: 0; margin: 0; }
.goal-option { display: flex; gap: 12px; align-items: flex-start; border: 1px solid var(--line); border-radius: 14px; background: #fff; padding: 15px 16px; margin-bottom: 10px; cursor: pointer; }
.goal-option:has(input:checked) { border-color: var(--green); background: var(--cream); box-shadow: 0 0 0 2px var(--lime); }
.goal-option input { margin-top: 4px; accent-color: var(--green); }
.goal-option span { display: grid; gap: 3px; }
.goal-option small { color: var(--muted); }
.goal-result { border-radius: var(--radius); background: var(--forest); color: #fff; padding: 28px; }
.goal-result .eyebrow { color: var(--lime); }
.goal-result p { color: #d5e5df; }
.goal-result h3 { color: #fff; }
@media (max-width: 760px) { .goal-finder-grid { grid-template-columns: 1fr; } }
.brand-mark{width:38px;height:38px;border-radius:13px;display:block;flex:0 0 auto;object-fit:contain}
.jurisdiction-switch{display:inline-flex;align-items:center;gap:.35rem;border:1px solid var(--line);border-radius:999px;padding:.35rem .7rem;color:var(--forest);background:#fff;font-size:.88rem!important}
.jurisdiction-switch:hover,.jurisdiction-switch:focus-visible{border-color:var(--green);background:var(--mint)}
.jurisdiction-icon{font-size:1rem;line-height:1}

/* Platform Pricing & B2B Matrix */
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 40px 0; }
.pricing-card { background: white; border: 2px solid var(--line); border-radius: var(--radius); padding: 34px 28px; position: relative; display: flex; flex-direction: column; justify-content: space-between; transition: transform 0.2s ease, border-color 0.2s ease; }
.pricing-card:hover { transform: translateY(-4px); border-color: var(--green); }
.pricing-card.featured { border-color: var(--green); background: linear-gradient(180deg, #f3faf6, #ffffff); box-shadow: var(--shadow); }
.pricing-badge { position: absolute; top: -14px; right: 24px; background: var(--lime); color: var(--forest); font-size: 0.75rem; font-weight: 850; letter-spacing: 0.08em; padding: 4px 14px; border-radius: 99px; text-transform: uppercase; }
.pricing-title { font-size: 1.4rem; margin-bottom: 8px; font-weight: 800; }
.pricing-subtitle { color: var(--muted); font-size: 0.9rem; margin-bottom: 20px; min-height: 44px; }
.pricing-price { font-size: 2.5rem; font-weight: 900; color: var(--forest); margin-bottom: 4px; line-height: 1; }
.pricing-period { color: var(--muted); font-size: 0.88rem; margin-bottom: 24px; display: block; }
.pricing-features { list-style: none; padding: 0; margin: 0 0 30px; border-top: 1px solid var(--line); }
.pricing-features li { padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 0.92rem; display: flex; gap: 10px; align-items: center; }
.pricing-features li::before { content: "✓"; color: var(--green); font-weight: 900; }

/* Interactive HR ROI & Cost Calculator */
.roi-card { background: var(--forest); color: white; border-radius: var(--radius); padding: 36px; margin: 40px 0; }
.roi-card h3 { color: white; margin-bottom: 10px; }
.roi-card p { color: #d5e5df; }
.roi-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; margin-top: 28px; }
.roi-stat { background: rgba(255,255,255,0.08); border-radius: 16px; padding: 20px; border: 1px solid rgba(255,255,255,0.12); }
.roi-stat-num { font-size: 2.2rem; font-weight: 900; color: var(--lime); line-height: 1.1; }
.roi-stat-label { font-size: 0.88rem; color: #d5e5df; margin-top: 4px; }

/* Interactive Sandboxes & Charts */
.sandbox-card { background: white; border: 1px solid var(--line); border-radius: var(--radius); padding: 32px; margin-bottom: 32px; box-shadow: 0 10px 30px rgba(0,0,0,0.03); }
.sandbox-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; flex-wrap: wrap; gap: 12px; }
.jurisdiction-tag { display: inline-flex; align-items: center; gap: 6px; background: var(--mint); color: var(--forest); padding: 4px 12px; border-radius: 99px; font-weight: 800; font-size: 0.82rem; }
.stress-chart-container { background: #fafcfb; border: 1px solid var(--line); border-radius: 16px; padding: 24px; margin: 20px 0; text-align: center; }
.slider-control { margin: 20px 0; }
.slider-control label { display: flex; justify-content: space-between; font-weight: 800; margin-bottom: 8px; }
.slider-control input[type=range] { width: 100%; height: 8px; border-radius: 99px; accent-color: var(--green); cursor: pointer; }

/* Decision Tree Cards */
.decision-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; margin-top: 24px; }
.decision-card { background: var(--cream); border: 2px solid var(--line); border-radius: 16px; padding: 24px; transition: all 0.2s; }
.decision-card.selected { border-color: var(--green); background: white; box-shadow: 0 8px 24px rgba(22,116,93,0.12); }
.decision-card h4 { font-size: 1.15rem; margin: 0 0 8px; color: var(--forest); }
.decision-badge { display: inline-block; background: var(--lime); color: var(--forest); font-size: 0.75rem; font-weight: 850; padding: 2px 8px; border-radius: 6px; margin-bottom: 12px; }

/* Digital Certificate Generator & Badge */
.cert-preview-card { background: linear-gradient(135deg, #0f342d, #1a564a); color: white; border-radius: 24px; padding: 44px; position: relative; border: 4px solid var(--lime); box-shadow: var(--shadow); }
.cert-watermark { position: absolute; right: 24px; bottom: 24px; opacity: 0.08; width: 180px; pointer-events: none; }
.cert-header-title { font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.2em; color: var(--lime); font-weight: 850; }
.cert-name { font-size: clamp(2rem, 4vw, 3rem); font-weight: 900; color: white; margin: 12px 0 6px; font-family: Georgia, serif; }
.cert-course { font-size: 1.1rem; color: #d5e5df; margin-bottom: 24px; }
.cert-meta { display: flex; justify-content: space-between; align-items: flex-end; border-top: 1px solid rgba(255,255,255,0.15); padding-top: 20px; font-size: 0.85rem; color: #d5e5df; flex-wrap: wrap; gap: 12px; }
.cert-hash { font-family: monospace; background: rgba(0,0,0,0.25); padding: 4px 10px; border-radius: 6px; color: var(--lime); }

@media (max-width: 980px) {
  .pricing-grid { grid-template-columns: 1fr; }
  .roi-grid { grid-template-columns: 1fr; }
  .cert-preview-card { padding: 28px; }
}

/* Hero Split Layout */
.hero-split { display: grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items: center; }
.hero-image { border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
.hero-image img { display: block; width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4/3; }

/* Section Image Panels */
.section-image-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.section-image-panel.reverse { direction: rtl; }
.section-image-panel.reverse > * { direction: ltr; }
.section-image { border-radius: var(--radius); overflow: hidden; box-shadow: 0 12px 40px rgba(18,63,55,.1); }
.section-image img { display: block; width: 100%; height: auto; object-fit: cover; }

/* Social Proof Bar */
.social-proof { display: flex; justify-content: center; gap: 40px; padding: 20px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin-top: 32px; flex-wrap: wrap; }
.social-proof-item { text-align: center; }
.social-proof-number { font-size: 2rem; font-weight: 900; color: var(--forest); line-height: 1; }
.social-proof-label { font-size: .82rem; color: var(--muted); margin-top: 4px; }

/* Module category icons */
.module-badge { display: inline-block; background: var(--lime); color: var(--forest); font-size: .7rem; font-weight: 850; padding: 2px 8px; border-radius: 6px; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 8px; }
.module-badge.advanced { background: var(--forest); color: var(--lime); }
.module-badge.pro { background: var(--orange); color: white; }

/* Pro callout banner */
.pro-banner { background: linear-gradient(135deg, var(--forest), #1a564a); color: white; border-radius: var(--radius); padding: 32px 36px; display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: 40px 0; box-shadow: var(--shadow); flex-wrap: wrap; }
.pro-banner h3 { color: white; margin: 0; }
.pro-banner p { color: #d5e5df; margin: 6px 0 0; }
.pro-banner .button { flex-shrink: 0; }

@media (max-width: 980px) {
  .hero-split { grid-template-columns: 1fr; gap: 32px; }
  .hero-image { max-height: 340px; }
  .section-image-panel { grid-template-columns: 1fr; }
  .section-image-panel.reverse { direction: ltr; }
  .social-proof { gap: 24px; }
  .pro-banner { flex-direction: column; align-items: flex-start; }
}

/* Tier Gating */
.tier-gate-container {
  position: relative;
  margin-top: 24px;
}
.tier-gate-blur {
  filter: blur(8px);
  pointer-events: none;
  user-select: none;
  opacity: 0.45;
}
.tier-gate-cta {
  position: absolute;
  top: 140px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--white);
  border: 2px solid var(--forest);
  border-radius: var(--radius);
  padding: 36px 32px;
  text-align: center;
  max-width: 480px;
  width: min(calc(100% - 32px), 480px);
  box-shadow: 0 24px 60px rgba(18,63,55, 0.22);
  z-index: 20;
}
.tier-gate-cta h3 {
  font-size: 1.5rem;
  margin-bottom: 10px;
}
.tier-gate-cta p {
  color: var(--muted);
  font-size: 0.95rem;
  margin-bottom: 20px;
  line-height: 1.5;
}

